QueriesNode.jsPanoramioAPIRespond.jsSasstransformTypeScriptVideoWebSocketレスポンシブWebデザインHTML2012.12.06AndroidCSS3HTML5iOSJavaScriptハイブリッドアプリというアプリ開発アプローチモバイル(スマホ、タブレット向け)アプリを開発する際に「ネイティブアプリで作るか?ブラウザアプリで作るか?」という議論は色々なとこでされているかと思います。通常はアプリの目的・内容に応じて、それぞれのメリット・デメリットを考慮して選択する事になりますが、今回は第3のアプローチ「ハイブリッドアプリ」について考察します。ハイブリッドアプリとは?本エントリーでのハイブリッドアプリとは、ネイティブアプリの中でWebView(アプリ内で動作する簡易ブラウザのようなもの)を使ってウェブコンテンツ(HTML5、CSS3、JavaScript)を配信するアプリを指します。ブラウザアプリとの違いは、ブラウザからはアクセス出来ないデバイスの機能(カメラやノーティフィケーションなど)が利用可能になるため、ブラウザを起動していない時でも通知出来たり、各ストアにネイティブアプリ同様に申請が出来るといった違いがあります。従来のウェブコンテンツ制作(HTML5、CSS3、JavaScript)を得意とするチームで開発が行いやすい、というのが一番のメリットだと考えています。iOS/Android専用アプリとして開発するには、Objective-C/Javaに長けた専任の技術者が必要といった事がネックになりがちです。レイアウトの自由度が高い専用アプリとして開発する場合、レイアウト調整を行う際にアプリのアップデート(ストアによっては審査)が必要となります。新機能開発→リリースにタイムラグが発生しますし、新バージョンと旧バージョンのユーザーが混在する事にもなります。ハイブリッドアプリの場合、アプリのアップデート不要でHTMLやCSSを編集する事でレイアウト変更が可能です。HTML、CSSで細部のレイアウト調整が可能なため、複雑なUIを構築したい場合に向いています。ハイブリッドアプリのデメリットパフォーマンスの問題2012年8月、FacebookのiOSアプリはハイブリッドアプリ(HTML5)→ネイティブアプリと方向転換しました。これはインフラの問題ではありますが、現在のテクノロジー・デバイス環境では満足なパフォーマンスが得られないためです。中長期的にはインフラが整い、HTML5が普及すると見られることが多いですが、現時点ではアプリの目的・内容次第で適さないケースがあることも事実です。ストアの審査が厳しいハイブリッドアプリの核となるWebViewですが、仕組み自体はiOS/Androidともに提供されていますが扱いが異なります。Androidでは公式ドキュメントが提供されるなど、開発者に選択肢の一つとして示されていることに対し、iOSやWindows8では、アプリの大部分をWebViewで実装されたものは審査が通り難いと言われています。ハイブリッドアプリの開発アプローチフレームワークを利用ハイブリッドアプリの開発方法の一つとして、Adobe社が買収した事でも有名な「PhoneGap」というフレームワークを使った方法があります。PhoneGapはほぼHTML、JavaScriptでアプリが開発出来るため比較的お手軽です。アプリ全体をフレームワークを介して処理する設計となればパフォーマンスで問題が出やすいといった指摘もあります。ViewsGoogle+やTwitterの公式アプリが採用しているアプローチで、ナビゲーションや画面遷移はネイティブの機能で実装するというもの。ナビゲーションや画面遷移はネイティブで実装しているため、全てHTML、JavaScriptで実装したアプリと比較して体感速度が上がります。ネイティブで実装する範囲と、WebViewで組み込む部分を明確に定義出来ていればオススメの方法でもあります。最後に今後、モバイルアプリを開発する際に当社がハイブリッドアプリを採用するかは現時点ではわかりません。アプリの目的・内容がベースにあり、それを実現するための手段の一つとして検討と考えています。HTML5を導入した制作の依頼・ご質問など、お気軽にお問合せください※(株)インフォマークのお問合せフォームへ移動します。重富ビル2FTEL.082-504-8311。