Altabel Group's Blog

Mobile Web App Frameworks Review: Sencha Touch vs jQuery Mobile

Posted on: December 14, 2012

Nowadays, more and more people use their mobile devices for the majority of their computer needs. That’s why mobile web application frameworks are in high demand for developers. There are several great mobile web frameworks that allow you to create an application with a native “look and feel” interface. Among them are jQuery Mobile, Sencha Touch, iWebKit, DHTMLX Touch, etc. If you have decided to develop a web application for mobile devices and you want to use a client-side framework to achieve this, Sencha Touch (ST) and JQueryMobile (JQM) seem to be the most serious options. What are their strong and weak points? Let’s see.

Sencha Touch

ST is a mobile web app development framework, which is compatible with HTML5, CSS3, and JavaScript. It is really a sensational framework widely used by mobile web developers. With it building web apps for mobile platforms which feel more like native apps is not a problem for a developer.

ST comes with a MVC framework which leads to a well structured code base. It is really a big plus, especially for large projects. Using ST you will likely not have to write a lot of HTML as the DOM (Document Object Model )is generated out of the objects models / widgets that you use. Besides, a wide range of UI widgets to choose from, as well as robust data, layout and component models are at your disposal.

Speaking of device support, ST website actually supports iPhone, Android and BlackBerry. It works really good on iOS. As for Android, it can be slow on large lists. Some problems may occur with Blackberry, so it may be better to choose another framework for this device.

ST also has enhanced support for touch events such as double tap, swipe, hold, pinch and rotate.

Developing on your desktop you should keep in mind that ST does not support all browser engines. You are required to use a browser based on Webkit (like Google Chrome or Safari). You are not able to view Sencha Touch apps in Firefox, Internet Explorer, or any other browser not using the Webkit engine.

ST provides great API documentation and sample demos. But the ST API uses a fairly large (120kb) JavaScript library that is much larger than the jQuery Mobile library.

ST is not easy to get running on the fly. It is almost a purely programmatic model, as you don’t design pages in HTML, but programmatically add elements to a page. So sometimes it’s difficult to make web design separately in HTML.

As for converting sites to work with the framework, it may involve a full front-end rewrite and it is very hard to debug and fix errors in ST.

Pros: MVC codebase; good support of iOS; enhanced support for touch events; great API documentation and sample demos

Cons: is not easy to get running on the fly; a large JavaScript library; problems with converting sites to work with the framework; very hard to debug and fix errors; may be slow on Android; not working properly on Blackberry

jQuery Mobile

JQM is Touch-Optimized Web Framework for Smartphones & Tablets. It is a unified user interface system across all popular mobile device platforms, built on the rock-solid jQuery and jQuery UI foundation.

JQM is really quick to develop with. You can just start with clean HTML markup and then apply “progressive enhancement techniques” or extra HTML element attributes to integrate mobile features into an existing semantic structure.

As for MVC, JQM doesn’t have it. So lot of care has to be taken while organizing the code.

The framework claims to offer a broad level of support across a wide range of platforms, and progressive enhancement for older devices and operating systems. Instead of writing unique apps for each mobile device or OS, the jQuery mobile framework will allow you to design a single highly branded and customized web application that will work on all popular smartphone and tablet platforms.

JQM includes a great AJAX-powered navigation system which enables animated page transitions while maintaining back button, bookmarking and clean URLs.

The framework comes with a CSS theme styling system that enables a simple project to get off the ground very quickly. Then this can be easily extended with your own custom styles. But the CSS theme styling system has limited options so sites built can look similar.

The bad thing is that page transitions and animations don’t feel ‘native’ enough and can be sluggish sometimes.

Pros: JQM is quick to develop with; supports all major browsers and platforms; has a great AJAX-powered navigation system; CSS theme styling system enables a simple project start very quickly

Cons: no given code structure (MVC); CSS theme styling system has limited options (sites may look similar); page transitions and animations don’t feel ‘native’ enough

So after comparing these two frameworks on some points, we see that ST has a given code structure and feels more like coding in Java/C# while jQuery Mobile is more like web with the HTML you write. So it’s better to use ST if you are used to Java/C# and only want to support such devices as iPhone and Android. And if you are a webdeveloper, used to jQuery and HTML and want to support the majority of devices and browsers, using jQuery Mobile seems to be more sound.

And what are your thoughts? I’m eager to know which mobile web application framework will you define as the best solution for developing a web app for a mobile device? Will it be Sencha Touch or jQuery mobile or some other great framework? Thanks and looking forward to your comments!

Yuliya Tolkach

Yuliya Tolkach
Skype ID: yuliya_tolkach
Business Development Manager (LI page)
Altabel Group – Professional Software Development

9 Responses to "Mobile Web App Frameworks Review: Sencha Touch vs jQuery Mobile"

Good Stuff . . . I agree . . .

sencha touch supports wp8 and ie. and mozikla is working on firefox support (aka any html5 browser) their build tools also reduce the library size by removing unused classes, you can also load existing html pages and wire in events to elements and use most of your code to also integrate with web site veion of the app. there are also dev builds thatbare in the download that help you debug your code and give framework hints. also to get started you can also download their dnd ide Sencha architect and you can visually build an app in hours. also at&t uses ST as their ap dev sdk

Very good review, thank so much!

thanks for the review..

How does the comparison go if you couple jQM with Backbone or Knockout or Angular etc…

I worked on Dojo . But no idea about jquery and sencha. I worked on native too. For me native is fast as I don’t have to struggle for ui

I do trust all of the concepts you have introduced in your
post. They’re very convincing and will definitely work. Still, the posts are too short for starters. Could you please extend them a little from subsequent time? Thanks for the post.

I agree with you, very good article! I used Sencha Touch in the past and i liked a lot the MVC structure of Sencha Touch apps.

I don’t agree with following cons on ST:
– a large JavaScript library
You should use the Sencha Cmd to build your app. It concatenates the JS which is only needed/used. Many Devs are surprised at first by frameworks file size which comes in the package, but they don’t know about sencha’s automation tool.

– very hard to debug and fix errors;
Never had this problem. Imo is the opposite, ST has built in an error system which even shows you what error, where, and the stack trace. To benefit of it you should use the dev or debug file which comes in the package. Fixing depends on Devs experience and capabilities. Also sencha community is very big and very helpful😉

– may be slow on Android;
In the last releases ST was greatly improved and now the responsiveness of the app depends mainly on how is written and on Android’s default browser(if to run same code on iOS you will notice the differences)

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: