source: http://www.gajotres.net/sencha-touch-vs-jquery-mobile/
A lot of people asking me this question, which framework is better Sencha Touch or jQuery Mobile.
Let me first tell you, talking about Sencha Touch and jQuery Mobile is like asking which one is better for server side web development, PHP or Java. While both of them can be used for same purposes in reality they are used for completely different purposes.
Where Sencha Touch is optimized and built to run exclusively on web-kit mobile browsers jQuery Mobile is built to globally work all around good on an available HTML browsers. This is more praise for Sencha Touch then jQuery Mobile, it may sound different but Sencha Touch’s optimization is probably this single best thing that makes it shine that much useful. Hybrid mobile applications made from Sencha Touch will run extremely fast and fluid almost native like.
At the same time jQuery Mobile covers completely different market segment. Unlike Sencha Touch which is built to work only on web kit browsers, jQuery Mobile will run on pretty much anything as long it supports HTML5 standard. It doesn’t matter are you running it on a Windows, Mac OS, Android, iOS it will run just fine and that makes it appealing to a broader specter of users.
This article is a part of a series where I am trying to explain differences between different HTML5 application frameworks. Original article is talking about broad differences between 7 most popular HTML5 mobile frameworks. Follow previous link if you want to find out more about them.
I will try to match them as best as I can, this will be told from my experience so don’t expect fully objective thoughts. Personally I do not prefer one over another – and I will never promote one over another. Next chapter will be covered in groups, and each group will have a winner.
Both Sencha Touch and jQuery Mobile are HTML5 mobile frameworks and they promote themselves like that. Were jQuery Mobile humbly promotes itself as a system built for all popular mobile device platforms Sencha Touch goes over the top promoting itself as aonly framework that enables developers to build powerful apps that work on iOS, Android, BlackBerry, Windows Phone, and more. Personally and subjectively I give them a negative point for puffery and false marketing. I really don’t see the point in overpraising something that is already that good, it is borderline narcissistic.
Verdict: jQuery Mobile wins
Look and feel. As you will see Sencha Touch and jQuery Mobile are simply different frameworks from UI point of view. First one is purely javascript driver while at the same time second one is HTML driven. Both of them have a great UI feeling, but Sencha offer more native like feeling (in case you are creating a hybrid mobile application). Unfortunately both of them will perform miserably if to large and complex UI is used, jQuery Mobile more then Sencha Touch.
Verdict:Sencha Touch wins
Again this is completely different story. jQuery Mobile is markup driven and its dependency on jQuery makes it extremely easy to master unless you prefer MVC architecture where Sencha Touch simply shines, of course that comes with a price of alien syntax, at least alien to those who have distanced them self from a vanilla javascript. In the end this ease of use will decide this match.
Verdict: jQuery Mobile wins
This is the point where even a great products can fall and become forgotten. Both frameworks have more or less good documentation background. Where Sencha Touch has probably bigger and better official documentation and jQuery Mobile has an excellent 3rd party information coverage. But, in the end, excellent Sencha Touch official documentation wins over jQuery Mobile.
Verdict: Sencha Touch wins
This is also an important topic. What kind of tools or plugins can be used to make my developer life easier.
Verdict: Tie, still this round slightly favors jQuery Mobile
All in all both frameworks are mature products and can stand on their own. jQuery Mobile is easier to master and will work great all around, but if you need something optimized for your hybrid mobile applications don’t look any further then about Sencha Touch.
Other HTML5 mobile frameworks worth mentioning can be found in my other ARTICLE.
A lot of people asking me this question, which framework is better Sencha Touch or jQuery Mobile.
Intro
Sencha Touch vs jQuery Mobile
Match 1 – Marketing and platform support
Sencha Touch
- Usable only one web kit browsers (this should allegedly change in the future)
- There are much more available mobile frameworks then Sencha Touch developers would want you to know
jQuery Mobile
- Large number of available platforms, but framework is not optimized for specific platforms (allegedly should be better optimized from version 1.4
Match 2 – UI and visual impression
Sencha Touch
- Extremely fast and fluid on mobile devices, all in all much better feel then jQuery Mobile
- It follows MVC philosophy, basically you don’t write any HTML, everything is done through javascript
- Currently it offers more UI elements/widgets, for example carousel implementation
- SVG support – making it great for games
- This is not directly related to UI but Sench Touch IDE is paid application
jQuery Mobile
- Unlike Sencha Touch, jQuery Mobile UI works much like classic web UI
- Everything is done through HTML where final UI is wrapped with a custom jQuery Mobile styles, just like jQuery UI
- UI is easily extendable and morph-able, with a little bit of CSS you can change any existing widget, even create new ones.From version 1.4 UI should be extendable to jQuery UI.
- Ajax driver which can be confusing to some developers + page transitions and animations don’t feel ‘native’ enough and can be sluggish sometimes
- CSS usage that makes it great also makes it looking like a clone, one application looks just like another, it requires a lot of time to make it look unique. Excellent example ismobile version of SongMeanings.com.
- Unlike Sencha Touch here you need to worry about page architecture, it can be problematic sometimes. Everything is tied together, which is good and bad at the same time. Version 1.4 should remedy a lot of this concerns.
Match 3 – Availability, ease of use
Sencha Touch
- It is all javascript, can be confusing for new developers
- Very hard to impossible to debug and fix errors in the framework
- Steep learning curve – at the same time worth of every hour spent on it
jQuery Mobile
- If you like jQuery (like a lot of people do) you will also like jQuery Mobile
- Easy syntax
- Unfortunately out of box MVC, it can be fixed with Backbone.js or Knockout.js
- Great theme roller support + everything can be easily manipulated through CSS
- Basically any IDE can be used to develop jQuery Mobile application.
Match 4 – Documentation
Sencha Touch
- Simply better official documentation the jQuery Mobile, large and not confusing, unless its syntax is not confusing all along to you
- Not that much 3rd party support or forums
- Official support is not free, not to mention official IDE platform
jQuery Mobile
- Good official documentation but not on a level of Sencha Touch
- Excellent 3rd party support, blogs, articles, forums, Stackoverflow….
- Better book coverage
Match 5 – Tools, Plugins, 3rd party support
Sencha Touch
- In house native app wrapper support
- Support for themes
- Unfortunately IDE is a paid application
jQuery Mobile
- Phonegap is used as a native app wrapper, also while Phonegap is an excellent tool it can behave weirdly when used with jQuery Mobile
- Support for themes, unfortunately this is not a full support because some core elements CSS can not be changed like this, for example active element glow
- Large number of 3rd party plugins is available, not to mention compatibility with jQuery plugins
- Can be extended much more easily then Sencha touch
Final thoughts
jQuery Mobile
Good
- Easy to develop
- Excellent 3rd party support, what through knowledge what through plugins
- Easy to debug
- Stackoverflow
Bad
- Slower then Sencha Touch, build to work all around
- Dull look unless you are capable UI designer, basically all applications look the same
- Official documentation is lacking in some segments, too few information about jQuery Mobile architecture and too much information about UI
Should be used
- For mobile sites
- Light hybrid applications
Code example
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
| <!DOCTYPE html><html> <head> <title>jQM Complex Demo</title> <meta http-equiv='Content-Type' content='text/html; charset=utf-8'/> <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=no; target-densityDpi=device-dpi"/> <!--<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>--> </head> <body> <div data-role="page" id="index"> <div data-theme="b" data-role="header"> <h1>Index page</h1> </div> <div data-role="content"> </div> </div> </body></html> |
Reading material
Sencha Touch
Good
- Faaaaast + better native feeling
- MVC architecture
- Excellent documentation
Bad
- Complicated, cant stress how much, not for inexperienced developers
- Bad 3rd party support, not that much information outside official site
- Only web kit support makes it useless for practically anything except hybrid applications
- Paid support and IDE
Should be used
- Complex hybrid applications – basically anything that should look and feel like a native app
Code example
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
| new Ext.Application({ name: 'MyApp', launch: function() { this.viewport = new Ext.Panel({ fullscreen: true, id : 'mainPanel', layout: 'card', items : [ { html: 'Welcome to My App!' } ] }); }}); |
Second book is intended for beginners and advanced developers. This book is a practical, hands-on guide with easy to follow recipes that provide you with clear, step-by-step instructions. My first real intro into a Sencha Touch world was through this book first edition. It is less about API more about step-by-step instructions, great for developers who lack advanced javascript knowledge.
댓글
댓글 쓰기