ハイブリッドモバイルアプリ開発をしてみて分かった、WebViewアプリのできることできないこと

  • 173
    いいね
  • 3
    コメント

少し前からシリコンバレーまわりで働いているのですが、こちらのスタートアップではアプリのプロトタイプをネイティブではなくWebViewで作るのは割と普通のことのようです。

私自身、数ヶ月前に趣味アプリとしてWebViewベースのハイブリッドモバイルアプリをiOSとAndroidで公開したので、そのときに感じたこと・ノウハウとかをまとめてみました。

使ったフレームワーク

Ionic Frameworkというフレームワークを使いました。

このフレームワークは、Cordovaという、JavaScriptからiOSやAndroidのネイティブコードにアクセスできる仕組みをもったプラットフォームをベースに作られています。

さらに、WebView上では流行りのAngularJSを用いられています。
また、Ioniconというiconが無償で提供されており、デザイナーがいなくてもかなり綺麗なUIのアプリを作ることができます。

タイトル詐欺で申し訳ないのですが、本記事ではバイブリッドモバイルアプリ全般というよりは、IonicやCordovaの話が中心になります。

学習コスト

これは明らかにネイティブコードで開発するより小さいです。Web開発経験があってJavaScriptやcssに慣れていればなおさらです。
ただIonicの場合、Angularに全く触れたことがない人だとAngularへの学習コストが発生します。

開発コスト

まずiOS・Androidを同時に開発できるという時点で、開発コストは非常に小さくなります。
また、iOS・Androidをネイティブコードで開発した場合のそれぞれのコード量よりも、Ionicで開発したコード量の方が少ないように感じます。
iOS版のみしか必要ないという場合でも、ネイティブよりは開発コストはずっと少ないです。

開発速度の差を一番感じたのは、UIを作っているときです。
やはりhtml5&css3によるUIの高い自由度のおかげで、viewのためのコードを書く必要がないのは非常にありがたいです。

パフォーマンス

iOS

簡単なアプリであれば、ネイティブと見分けがつかないレベルのサクサク具合です。
ただ、あまりに長いリストビューを何も考えずに実装すると重くなるので注意が必要です。

Android

Android 4.4(KitKat)より前のバージョンのOSだと、かなりパフォーマンスが悪くなります。
これは4.4より前のバージョンでは、WebViewに古いバージョンのChromiumを採用しているためです。

2015/07/13現在、4.4より前のバージョンのシェアは半分弱あるので、これが無視できないと感じるのであれば、IonicでAndroidアプリを開発するのは厳しいです。

実現できる機能

開発をしているとDBやソフトウェアキーボードなど、プラットフォームに依存した機能が必要となることがあります。
Cordovaはプラグインをインポートすることで、ネイティブで提供されている機能をJavaScriptから利用することができます。

多くの人が必要としそうな機能のためのプラグインは、だいたい探せば見つかります。
逆に言うと、マイナーな機能が欲しいときには苦労します。

機能についてまとめると

  • 簡単な機能はプラグインを使えば、ネイティブで開発するより簡単に実現できる
  • ネイティブにべったりな機能を実装したり、マイナーなネイティブSDKを利用しようとするとネイティブで開発する方が楽

といった感じです。

個人的に利用したプラグイン

欲しいプラグインがない場合

これらのプラグインの多くは個人開発者によるものです。
欲しいプラグインがない場合は自分で開発することもできます。

私の場合、アプリに広告を載せたかったのですが、とある事情でAdMobを利用することができなかったので、Nend広告を載せる必要がありました。
しかしNend SDK用のプラグインはなかったので、自分でプラグインを開発して無事Nend広告を表示することができました。
開発にかかった時間はトータルで3日ほどです。プラグイン開発に関する情報はまだかなり少ないようでしたので、また次の機会にCordovaプラグイン開発についてもまとめたいと思います。

まとめ

Ionicかネイティブ開発かを決める際は、以下のように考えればよいかと思います。

  • 特にネイティブに依存した複雑な機能がなく、古いAndroidバージョンを切り捨てられる場合はIonic
  • 複雑な機能がある or 古いAndroidでもサクサク動いて欲しい場合はネイティブ

今回書いたことの他に「ハイブリッドアプリのここが知りたい」みたいなのがあれば、ガンガン聞いてください!