HTML5でのハイブリッドアプリ
今日、Asialとい会社のセミナーに参加した。
主にシステム系の仕事をしている会社で、
２年前くらいに「Monaca - HTML5モバイルアプリ開発プラットフォーム」を
立ち上げている。
僕も１年前くらいから利用させてらっています。
バイブリッドアプリの利点は
何と言ってもマルチプラットフォームだ。
WEB技術で、iOS / Android / Windows8 などのアプリの書き出しができる。
そもそも、ネイティブアプリ（Objective-C、Java）は、
開発コストがかかりすぎるので、実際形になりにくい。。。
HTML5の技術も進歩しているし、
WEB技術とネイティブをつなぐPhoneGapという
フレームワークもあるので、
見た目上はネイティブと変わりないアプリを制作できる。
ネイティブアプリを超える事は不可能ですが、
アプリ内容によっては、ハイブリッドアプリの方が、
コストパフォーマンスは非常にいいと思います。
ただ、ネイティブアプリに比べると
ちょっとやぼったいというイメージはあった。
その辺も、初めからWebViewの技術を理解した上で
htmlコーディング作業をすれば解消されるようです。
今日聞いた解決方法を簡単に書き出しておきます。
〜〜〜〜〜
【描画処理】
・タッチイベント使う tappableやfastclick
・zepto.js使う
※jqueryは不必要な要素が多く含まれるので使わない
・なるべくリフローを起こさない
※レイアウトを計算してからレンダリングしてるから
解決策
要素の縦横を固定しておく（position absolutionを多用する）
transformを使う
・chromeインスペクターでリフロー確認
・アニメーション transformを使う
・GPU活用する translate3Dを使う
・DOMdocumentfragmentを使う
・onsen UIを使う（ハイブリッド用フレームワーク）
The Answer to PhoneGap UI Development | Onsen UI
〜〜〜〜〜
という感じで考えながら実装すれば、
やぼったさも解消されるそうです。
また新たにパートナー制度も始めたようなので
利用するのも良いかも。
【追記】
スライドが送られてきたのでシェアします。
