プロフィール

Author:はるかわ しおん
なにか、新しいものを。
そして、楽しいものを。

FC2カウンター


上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
  • ハイブリッドアプリの設計 #html5j #jag201305

第39回 HTML5とか勉強会+日本Androidの会 2013年5月定例会
ハイブリッドアプリの設計
#html5j #jag201305



アプリ環境の流れ
端末のスペックアップ
HTML5仕様かたまってきた
iOSのUI面の審査が緩くなってきた
AndroidのOS分布が変わってきて、2.1がなくなってきている


ハイブリッドアプリのタイプ(HTML5を生かしたアプリということにしとく
公式マーケットで配布できる
複数プラットフォームに対応しやすい

タイプ1
WebViewをラッピング1
WebViewを包むだけのもの
コンテンツはHTMLをサーバーに置く
Webアプリをそのまま移植できる
デメリットは、通信時のデータ量が多くなる (JSONとかよりも

WebViewをラッピング2
HTMLをアプリに埋め込んでおく
サーバーとはAPI通信をする
ローカルでもある程度動かし、HTML5のオフライン実装でいい感じに作る

一部の画面でWebViewを利用する
基本的にはネイティブアプリ
WebViewを利用することでメリットがある画面は、WebViewを使う

選択について
出来上がるものの品質
実装コスト(HTML5でどれだけ楽になるのか
→ここはなにか仕様変更がありそうだから HTML5 を選ぶ、とかもありである
運用コスト (データの更新頻度・手間はどれくらいか

WebView でやらないほうがよいもの
リスト・ギャラリー画面
ネイティブだと専用のビューがあるが、ネイティブのビューは性能が良いのである (再利用性とか
リストを次へ次へと読んでいきたいときは重くなるのでよくない
起動時の画面
表示するコンテンツ以外に負荷情報を取得したい画面

WebView が適しているもの
詳細画面などのコンテンツ
HTMLのメリットは、レイアウト能力の高さ、つまり文章の見易さに関すること (文字の回り込みとか枠つけとかリンク挿入とか
更新されていく情報に対応しやすい

実装例1
WebViewの進む・戻る遷移とNativeの画面遷移との関係が複雑になり、わけわからなくなる

WebViewでのリンク遷移はさせない方針がよい
(or 遷移はWebViewで行い、Nativeはダイアログのみにする とか)

実装例2
要素の長押し処理・フリック処理はJavaScriptで行い、Native側に通知するのがよい
call, mailto: などのリンクは定番なので、対応しておくこと
Cookieでログイン様態を連動させることをよくやる

忘れがちなこと
HTMLでの遷移は、画面遷移ごとにサーバーから取得するが、ネイティブなら、
実際に使ってみると、設計時には気づかなかったが待ち時間が多い、なんてことが起こりうるので気を付けい!

HTML5を使う運用上の理由
A/Bテストや一部ユーザ向けテストをするための環境が整っている
スマホサイトとAndroidでコンテンツを共通化できる

まとめ
WebViewのメリット・デメリットをもっと把握しよう
運用は大切
仲間も大切
→「チェインバー、ヤツは何を言ってる!」「クックパッドさんは仕事が忙しいと言ってる」#html5j #jag201305





コメント

コメントの投稿

   管理者にだけ表示を許可する
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。