前回（６月）にメジャーといえるHTML5モバイルフレームワーク２つを紹介しましたが、実際に仕事の案件が入った事もありそれに合わせて５つのフレームワークをピックアップし、もう少し調査した結果をまとめておきます。

今回はビルドなどが必要ない無垢のHTML+CSS+Javascriptであるライブラリであること、そしてiPadなどのタブレット（というかiPad）のデバイスも含んだGUIライブラリが提供されている事を条件に探すことになりました。
最初の条件のビルドが必要ないという件ですが例えば、The-M-ProjectはNode.jsを必要とするとか、Titanium Mobileは独自のビルドが必要など、それぞれは注目に値するプロダクトではあるのですが今回は選択肢から外しています。

最終的な評価は、仕事の案件に要求するものが満たされているか？なので他者から見れば「独断と偏見」になるかもしれません。
参考までに今回の要求というか、やりたい事をまとめておきますと、

・ビルドが必要ないこと、つまりサクッとプロトタイプ作ってサクッと仕上げたいしサクッとメンテしたい。
・アプリケーションにはパッケージしない、ただPhoneGAPのような形式は最終的に考えたいです。
・初期の勉強は最小に、試行錯誤しながらサクッと作りたい。（コーディングはHTML記述メインで構築したい）
・用途は電子カタログ的な形態。画像、動画なども含まれ、タッチインターフェースを有効に使いたい。

Sencha Touch（紹介済み）
Sencha TouchはPCのJavascriptのフルスタックライブラリのExtJSを開発するSenchaが提供するHTML5モバイルJavascriptフレームワーク。


ExtJSはブラウザで高度なGUIアプリケーションを作成できる定評のあるライブラリで、Sencha Touchはその仕様をベースとしていてExtJSユーザーなら新たに学習の必要がないようになっています。
GUIの部品の数、機能の多さ、どれをとっても一番の超リッチなフレームワークといえます。
有料のスタンドアロンアプリでExt Designerというのがあります（有償３万円）。ただ残念なことにまだSencha TouchのGUIには対応してないようです。


jQuery Mobile（紹介済み）
やはり何といってもHTML記述だけでモバイルのUIが出来てしまう簡単、軽快な仕様が特徴です。


そしてjQueryでのDOM操作等のAPIに慣れている人には唯一の選択肢かも。やはり仕様のセンスのよさはjQueryゆずりですね。
ただjQuery本体がだんだん仕様が膨れて大きくなっているので少し気になりますね。
jquery.mobile-1.0rc2.min.jsで24KB、それに加えて、jquery1.7は91KBもある、、そういう時代になったのですね。


Dojo Mobile
Dojo Toolkitの拡張機能(dojox)として提供されています。
Dojo ToolkitはPCのJavascriptのフルスタックライブラリ。Senchaと同じように既存のDojoユーザーには最適かも。


dojo.requireはJavasciptライブラリの動的ロード機能でとても強力です。モバイルのようにメモリに制限がある環境では特に便利。フルスタックのフレームワークとしてはDojoは本当に良く出来ていると思います。
構築方法がHTML/JS両方というのはDOM操作で作れるというのでなくコンポーネントベースでオブジェクトが生成できるということです。


DHTMLX Touch
ビジネスアプリにはいい感じ。オンラインでのビジュアルデザイナーもあって部品を配置するとそのままで動作するHTML一式がダウンロードできる。これがけっこうよく出来ていてすばらしい。


オープンソースらしいけど他の製品が商用だったりで少しクローズドな感じがあります。


Wink toolkit
タッチイベントや位置情報、ストレージなど機能的なものは一通り搭載されているのでミニマムなGUIで作る場合に向いていると思います。またや独自のデザインのWEBアプリにも合うと思います。


HTML構築の割に、設定に結構なJavaScriptコードを必要とするのでjQuery Mobileのような軽快性はないです。ただ全てのライブラリを含んだwink.min.jsでも25KBというサイズなのは魅力です。ただしコア機能のみで、拡張機能（ui, ux, mm, net, fx, math, api）はそれぞれ必要な時に読み込んでおく必要があるので少し面倒。でも無駄が無いのでこれはこれでいいと思います。
目立たない存在ですがまじめに作られていて、ドキュメントもよくまとまっています（英語のみ）。
（実はWinkもDojoプロジェクト）



やはり万人が使いやすいものにする最善の方法はHTML定義による構築なんだと思います。やはり構造がつかみやすいですし、修正も簡単です。
したがって選ばれるものは、
　・Dojo Mobile
　・jQuery Mobile
　・Wink toolkit
の３つとなりました。
ただWink toolkitは定義に結構なスクリプトを必要とするため残り二つが現時点で有力なフレームワークとなります。

一般的な考え方ですとjQueryに歩があるといえましょうか。でも海外ではDojoは広く普及してますし、フルスタックなフレームワークと完全にシームレスであることから個人的には非常に興味があります。実はDojo Toolkitバージョン1.0が出た頃によく使っていました。
HTML定義の方法はどちらもHTML要素のアトリビュートに機能やオプションを定義するタイプで、その書きやすさ、可読性などは実際にいくつか作ってみないとわかりませんね。

デザイン的なものでいうとプラットフォームに忠実なDojoと、独自でセンスの良いjQuery Mobileといったところでしょうか。ただjQuery Mobileで作られたサイトは一目でわかるので欠点になってしまうかも知れません。

さて、今回制作するタブレット向けのWEBアプリ、どちらを使いましょうかね？

コメント追加

タイトル
名前
E-mail
Webサイト
本文
情報保存	する  しない
情報保存をすると次回からお名前等を入力する手間が省けます。 E-mailは公開されません - このエントリーの新規コメント通知が必要なら記入します。
Re: HTML5モバイルフレームワークの比較 vol.2 投稿者 Anonymous : 2012/05/17 7:49:52 JST 返信

このエントリーのトラックバックURLを表示