More Related Content More from dsuke Takaoka (20) Sencha Touch 2 vs jQuery Mobile1. Touch 2
vs
jQuery Mobileが許されるのは素人までだよねww
DeveloperならやっぱりSencha Touch!
2012.11.08
SenchaUG 勉強会 第2回@東京
@dsuket
9. いきさつ
Sencha Touch Lover です。
最近は jQuery Mobileのお仕事も増えた。
jQM 使いづれーーー!!!
Sencha ならもっと るのに。。。
jQuery Mobileを全力でdisるお! (`・ω・́)
12. SENCHA TOUCH 2
✴ 洗練されたデザイン
✴ 高いパフォーマンス
✴ 50以上の豊富なコンポーネント
✴ 柔軟なADAPTIVE LAYOUTS
✴ NATIVE PACKAGING
✴ HISTORY状態管理
✴ 拡張性のあるクラスシステム
✴ 堅牢なビルトインMVC
✴ and more...
15. 最高のパフォーマンスと
驚きの体験を
圧倒的な速さで実現します。
そう Sencha Touch 2 ならね
28. JQM 3RD PARTY PLUGINS
3rd party plugins/extensions で色々あるよ!
jQuery Mobile Icon Pack
iOS inspired theme
jQuery-Mobile-Bootstrap-Theme
36. SENCHA TOUCH 2 THEME
Compass/Sass で楽々カスタマイズ
変数、Mix-In など便利機能満載
Theme Contest
37. JQM 3RD PARTY EXTENSIONS
jQuery Mobile Less Version
コンポーネント毎にLESSで定義
変数、Mix-Inも使える
38. JQM 3RD PARTY EXTENSIONS
jQuery Mobile Less Version
コンポーネント毎にLESSで定義
変数、Mix-Inも使える
あれ?結構つかえるかも・・
52. JQUERY MOBILE LAYOUT
ui-grid-x でグリッドレイアウト
ui-grid-b (3 column)
ui-block-a ui-block-b ui-block-c
<div class="ui-grid-b">
! <div class="ui-block-a">Block A</div>
! <div class="ui-block-b">Block B</div>
! <div class="ui-block-c">Block C</div>
</div>
58. SENCHA TOUCH 2 LAYOUT
Adaptive Layout
HBox, VBox, Card, Fit, Docking
Pack and Align
72. JQM AJAX BEST PRACTICE
イベントリスナーの登録
$(document).ready()
$(document).on( pageinit , #page-id , ...)
73. JQM AJAX BEST PRACTICE
イベントリスナーの登録
$(document).ready()
$(document).on( pageinit , #page-id , ...)
Google Analyticsの使い方
74. JQM AJAX BEST PRACTICE
イベントリスナーの登録
$(document).ready()
$(document).on( pageinit , #page-id , ...)
Google Analyticsの使い方
jQuery Mobile Best Practice みてください
87. JQUERY MOBILE X MVC
他のMVC Frameworkとの組み合わせ
jQM x JavaScriptMVC
jQM x Backbone.js
jQM x Ember.js
104. SENCHA TOUCH 2 PROS
なんでもできる優等生
全部これ一本で完結!
品質・パフォーマンスも良い
高い拡張性と保守性
ビルトインMVC
豊富なドキュメント
Sencha Market
107. SENCHA TOUCH 2 CONS
最初のハードルが高い
全てJSで生成
Sencha Architect という手も
ファイルサイズがでかい
最初のロードがやや遅い(パフォーマンスとのトレードオフ)
108. SENCHA TOUCH 2 CONS
最初のハードルが高い
全てJSで生成
Sencha Architect という手も
ファイルサイズがでかい
最初のロードがやや遅い(パフォーマンスとのトレードオフ)
サポートPlatformがやや劣る
Firefox、Opera 非サポート(Windows 8は対応!)
123. WEB APP VS NATIVE
WebAppの適用範囲が広がっている &
そもそも高機能性が必要ないアプリも多い。
124. WEB APP VS NATIVE
WebAppの適用範囲が広がっている &
そもそも高機能性が必要ないアプリも多い。
簡単にjQMでも作れそうなアプリが沢山
125. WEB APP VS NATIVE
WebAppの適用範囲が広がっている &
そもそも高機能性が必要ないアプリも多い。
簡単にjQMでも作れそうなアプリが沢山
優れたUXが必要なら Sencha Touch で
126. WEB APP VS NATIVE
WebAppの適用範囲が広がっている &
そもそも高機能性が必要ないアプリも多い。
簡単にjQMでも作れそうなアプリが沢山
優れたUXが必要なら Sencha Touch で
今後もますますWebAppFrameworkは熱い!
127. WEB APP VS NATIVE
WebAppの適用範囲が広がっている &
そもそも高機能性が必要ないアプリも多い。
簡単にjQMでも作れそうなアプリが沢山
優れたUXが必要なら Sencha Touch で
今後もますますWebAppFrameworkは熱い!
今のうちに勉強しておきましょう!
136. XTEMPLATE
Sencha Touch の Weak Point
全てJSで作るのでサイトは苦手
モバイルサイト(not App)は jQM に軍配
Sencha Touch でもモバイルサイトができないか
jQMとの比較を考えてたら今回のになった・・・