jQueryMobileとSenchaTouchのサンプル眺めてみた。
jQueryTouchとSenchaTouchのサンプル眺めてみた。
眺めた環境
- Xperia X10(Android2.1)
- GalaxyTab(Android2.2)
- FireFox(3.6.x)
- GoogleChrome(PC webkit)
互換性
上記4つのブラウザ(スマホ側はあえてデフォルトを使用)で眺めてみた。
jQueryTouch のサンプルは、上記すべてのブラウザで表示できるのを確認。ただし、FireFoxに限り、スクロール等の一部エフェクトがかからない。
SenchaTouch のサンプルは、FireFoxがそもそもまともに表示できない。他の環境はいずれも正常表示ができている。公式の互換性についても、jQueryTouch はほぼすべての主要なスマホに対応しているが、SenchaTouch は iPhone/Android向けで、他のプラットフォームに言及していない。
SenchaTouch も XperiaとGalaxyTabで見れているので、低解像度のプラットフォームでどう見えるか次第な気はする。
今後、Android1.6とかは一気に減るだろうし、どんどんスマホの解像度もよくなっているので、そこまで気にする程ではないのかもしれない。*1
ライセンス
jQueryTouchはMIT/GPL2で、SenchaTouchは商用の場合はTouchCommercialLicence、無償の場合はGPLだそうな。
作るものによっては、SenchaTouchにお金払っても十分かも？と今時点で思う。
サンプルサイトの操作性を見てみる
jQueryTouch の場合、スクロール操作の慣性や、一部操作性を、クライアントブラウザに任せている節がある。
それに対し、SenchaTouch は、リストのスクロール、慣性、アニメーション、いずれもライブラリで対応している模様。
これは何で響くかというと、スマホ以外のプラットフォームで、タッチインターフェースを前提としていなくとも、Webkit 対応ならタッチインターフェースであるかのように操作できる。
Windows7Tabletで、Chromeがタッチインターフェースに対応していなくて、慣性を持ったスクロールなど、操作にイラっとくる場合がある。これはそんな時もキッチリ面倒を見てくれるようだ*2。
UIの違い
jQueryTouchのUIは非常にシンプルで、まさに必要最小限といった構成か。
SenchaTouchの場合は、さすがExt系統。UIコンポーネントの質、量共に申し分ない。
ここの差は特に、あくまでWebサイトとしてのUIか、それともアプリケーションとしてのUIかという差に見えなくもない。
というのも、SenchaTouchは、ヘッダツールバー、フッタツールバー(どちらも常時表示)を置いたり、タブを表示してみたり、バーにアイコンを置いたりと、iPhone の CocoaFramework を彷彿させるようなUIがほとんど揃っている。
さらにSenchaの場合は、ブラウザの解像度によって、表示モードを切り替える。Chromeでアクセスして、ブラウザサイズを変更すると、サイズに合わせて操作しやすいようにかレイアウトを動的変更している。
これがライブラリ内で対応しているのか、そういうコードが別途必要なのかは別としても、すごい話だ。
チュートリアルの中身から見た実装
パッと見は jQueryTouch のほうがとっつきやすい。というのも、表示カタログにコードまで載せてる新設設計。
基本はHTMLタグで全体をデザインし、スタイルシートや一部操作をJavaScript/CSSで補足するスタイルの実装のようだ。
それに対し、SenchaはいきなりJavaScriptの嵐。Flex経験も1年以上あるし、ECMA系だから普通に読めるけど、マークアップはまだしも、プログラムでUIを作るとなると、挫折する人が多そうな予感はする。*3
環境としては、Senchaの場合、デバッグライブラリやテストライブラリがあるご様子。これは便利そうね。
ちなみにあたりまえだけどどっちも英語必須。
今時点での感想
どっちがいいとかは置いといて、jQueryTouch はスマホ向け Web サイト構築ツール。SenchaTouchは本格的なWebアプリ作成ツールと思った。
というのも、サーバ側ViewでUI決定して、動的にサイト構築する場合は、jQueryTouch のように、HTML吐いて出せるというのは非常にやりやすい。
そうではなくて、UI表示をクライアント側につくりこんで、サーバはデータを返すだけ！と割り切るのなら、SenchaTouchという印象です。
(追記)と思ったらMoonGift様でも同じような紹介してたコトに気づく。スマートフォン最適化サイトの本命かとHTML5対応のモバイル向けWebアプリケーションを構築するなら
