![\"Comparing](\"http:\/\/www.dzyngiri.com\/dginwp\/wp-content\/uploads\/2012\/04\/featured-Image-copy.jpg\" "\\"featured-Image")
<\/p>\n<\/p>\n
It\u2019s been an exciting year for the mobile Web. Adoption of HTML5 and CSS3, improved performance in mobile browsers, and an explosion of mobile app frameworks mean it\u2019s more feasible than ever to create rich, interactive Web experiences for mobile devices. Using a wrapper like PhoneGap, you can distribute them via the native app stores for iPhone, iPad, and Android \u2014targeting multiple platforms with a single code-base.<\/p>\n
Mobile Web developers have a plethora of frameworks to do the heavy lifting for them: animated transitions, toolbars, buttons, list views, even offline storage. Most of these are new and the landscape is shifting rapidly. I have gone through many of the Mobile web frameworks and compared and analyzed them. And here is something what I found:<\/p>\n
jQTouch<\/a>\u00a0is easy to use and relatively well-documented. It\u2019s featured in the excellentBuilding iPhone Apps with HTML, CSS, and JavaScript<\/a>. jQTouch takes a progressive-enhancement approach, building an iPhone-like experience on top of your appropriately-constructed HTML. It\u2019s simple, providing a basic set of widgets and animations and just enough programmatic control to permit more dynamic behavior.<\/p>\n But even in my simple test app there were performance issues. Page transitions can be jumpy or missing, and there are periodic delays in responding to tap events. And while the project is technically active, the original author has moved on and development seems to have slowed.<\/p>\n jQTouch is available under the permissive MIT License, one of my favorite open source licenses.<\/p>\n jQuery Mobile<\/a>\u00a0was the new kid on the block. Announced in August 2010, it\u2019s quickly progressed to a very functional Alpha 2 and now on February 28 it comes with a JQM 1.1.0. It takes a similar \u2013 but more standards-compliant \u2013 approach to jQTouch and feels very much like that framework\u2019s successor, with a broader array of UI controls and styles.<\/p>\n jQuery Mobile\u2019s performance is variable (though better than that of jQTouch), particularly in responding to tap events rendering animations. It also lacks a small number of key programmatic hooks that would permit easy creation of more dynamic apps. For instance, there\u2019s an event that triggers when a page is about to load (i.e. slide into view) but no way to tell the associated handler code what UI element resulted in the page switch, or to pass additional information to that handler. I was able to create workarounds but hope that future versions will take a cue from jQTouch and build out this functionality a little more.<\/p>\n In the 2011 end and the starting of 2012 the JQM catched the eye of lot of web geeks. And it is the most improving framework in the Mobile Web industry.<\/p>\n jQuery Mobile is available under either the MIT or the GPL2 license.<\/p>\n Sencha Touch<\/a>\u00a0is the mobile counterpart to the\u00a0Ext JS<\/a>\u00a0framework. Its approach differs significantly from jQTouch and jQuery Mobile: instead of enhancing preexisting HTML, it generates its own DOM based on objects created in JavaScript. As such, working with Sencha feels a little less \u201cwebby\u201d and a little more like building apps in other technologies like Java or Flex. (It\u2019s also a bit more like\u00a0YUI\u00a0<\/a>than like\u00a0jQuery<\/a>.) I personally prefer the progressive enhancement approach, but it really is a matter of preference.<\/p>\n Sencha is far more extensive than its competitors, with a vast array of UI components, explicit iPad support, storage and data binding facilities using JSON and HTML5 offline storage, and more. (It\u2019s very cool to manipulate app data in one of Sencha\u2019s data structures and watch the corresponding list update in real time.) It\u2019s also the only Web framework I\u2019ve seen with built-in support for objects that stay put (like a toolbar) while others scroll (like a list).<\/p>\n For all that apparent extra weight, Sencha performed noticeably better and more reliably than either jQTouch or jQuery Mobile in my tests, with the exception of initial load time.<\/p>\n When working with a library or framework, it\u2019s usually counterproductive to \u201cfight the framework\u201d and do things your own way. Given how extensive Sencha Touch is, that means your app will probably end up doing just about everything the Sencha way. I\u2019d originally usedWebKit<\/a>\u2019s built-in SQLite database for offline storage but ultimately eliminated both complexity and bugs by moving that functionality into Sencha\u2019s data stores.<\/p>\n The documentation, while extensive, has odd holes. Between those and the sheer size of the framework, I spent a lot of time fighting bugs that were difficult to trace and to understand. Responses to my questions in the developer forums were more frequent and helpful than with the other frameworks, but still ultimately insufficient. Sencha provides paid support starting at $300\/year; I strongly considered purchasing it but oddly, their response to my sales support inquiries was incredibly underwhelming given my interest in sending them money.<\/p>\n Sencha Touch is available under the GPL3; under a somewhat confusing set of exceptions to the GPL that seem similar to the LGPL; or under a free commercial license.<\/p>\n Much like Sencha Touch, Appcelerator\u2019s\u00a0Titanium Mobile<\/a>\u00a0allows you to write apps using a JavaScript API. But unlike Sencha, it compiles most of your code into a native iPhone or Android app. That means it isn\u2019t really a Web framework, but a compatibility layer or compiler. (Note that its cousin\u00a0Titanium Desktop<\/a>\u00a0is Web-based, allowing you to write HTML\/JS applications that run inside a native wrapper on the desktop.)<\/p>\n So Titanium allows Web developers to produce high-performance, easily skinnable native apps using JavaScript and a little XML, i.e. without learning Objective-C or Cocoa Touch. My simple test app blew away the true Web frameworks in terms of performance, and wasn\u2019t much harder to put together.<\/p>\n But that advantage is also its greatest disadvantage: you can only target the platforms Titanium supports, and you\u2019re tied to their developer tools. As if to prove this point, my test app quickly got into a state where it wouldn\u2019t launch on the iPhone. Titanium doesn\u2019t include much of a debugger; Titanium projects can\u2019t be run and debugged in XCode; and it ran fine in the simulator, leaving me with no real way to attack the problem.<\/p>\n Rebuilding my app on three of these four frameworks was tedious but educational. I like jQTouch but have trouble believing it will evolve much from here. I\u2019m rooting for jQuery Mobile for its simplicity and its very Web-centric approach to development\u2026but it lacks a few key features and doesn\u2019t perform as well as Sencha Touch.<\/p>\n It\u2019s unfair to compare an Alpha 2 product with a 1.0 one, except in one respect: I need something now. Which brings me to Sencha Touch. I was initially impressed with its performance and breadth, but put off by its development style. As I\u2019ve dug in, the holes in its documentation have been frustrating but the breadth has continued to impress me, and I\u2019ve gotten more used to the coding style. The option for paid support is tempting, and I\u2019d probably buy it if they\u2019d answer my emails. But for now, Pints is a Sencha-based app.<\/p>\n I haven\u2019t answered the big question: can a Web-based app really hold its own alongside native apps? And if so, are the challenges of getting it there worth the benefit of a single codebase?<\/p>\n The answer is YES ! Because the Web-based apps needs the core knowledge of HTML5 and CSS3.<\/p>\n","protected":false},"excerpt":{"rendered":" It\u2019s been an exciting year for the mobile Web. Adoption of HTML5 and CSS3, improved performance in mobile browsers, and an explosion of mobile app frameworks mean it\u2019s more feasible than ever to create rich, interactive Web experiences for mobile devices. Using a wrapper like PhoneGap, you can distribute them via the native app stores … Continue reading Comparing HTML5 Mobile Web Framework<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[35],"tags":[185],"class_list":["post-1119","post","type-post","status-publish","format-standard","hentry","category-35","tag-html5"],"_links":{"self":[{"href":"https:\/\/www.strongd.net\/index.php?rest_route=\/wp\/v2\/posts\/1119","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.strongd.net\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.strongd.net\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.strongd.net\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.strongd.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1119"}],"version-history":[{"count":1,"href":"https:\/\/www.strongd.net\/index.php?rest_route=\/wp\/v2\/posts\/1119\/revisions"}],"predecessor-version":[{"id":1120,"href":"https:\/\/www.strongd.net\/index.php?rest_route=\/wp\/v2\/posts\/1119\/revisions\/1120"}],"wp:attachment":[{"href":"https:\/\/www.strongd.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1119"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.strongd.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1119"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.strongd.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1119"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}<\/h2>\n
<\/h2>\n
<\/h2>\n
<\/h3>\n
<\/h3>\n