Why Jquery Mobile (JQM) over other frameworks?

Declarative vs Programmatic

The answer to this question becomes pretty obvious considering my last post- Declarative vs Programmatic JavaScript frameworks.  To summarize in one line, declaritive frameworks give a very low learning curve and allow to mix-in all the tools, tricks, custom JavaScript libraries and everything else that you are already using rather painlessly.  Although the end results are still a little less impressive than the end-results you might get from Sencha the differences are rather slight.

Again, if you are stuck working with legacy server side coding, like JSP or ASP the declarative approach is your only solution that wouldn’t involve bending over backwards to fit a square peg in a round opening.

Major Mobile Frameworks Categorized

Framework Type Link
Sencha Touch Programmatic http://www.sencha.com/products/touch/
jQuery Mobile Declarative http://jquerymobile.com
Dhtmlx Touch Programmatic http://www.dhtmlx.com/touch/
Dojo Mobile Declarative http://dojotoolkit.org/features/mobile
Wink Toolkit Programmatic http://http://www.winktoolkit.org

As you can see there is a quite a few of both.  But having disqualified all programmatic frameworks rather quickly our decision is simplified. (In reality I actually downloaded almost everyone of those, and made demo apps before disqualifying them.  Additionally I tried out all their demo’s on an Android 2.2 device, where JQM was actually NOT the most impressive, but not far behind.)

jQuery Mobile vs Dojo Mobile

Now we are left with only two frameworks two chose from jQuery Mobile and Dojo Mobile.

jQuery Wins

Wait! What? That was a little too fast, where’s the discussion where the reasoning?

What does jQuery Mobile has Going For It?

  • Backed by jQuery
  • Good looking UI
  • Really easy to use
  • Decent set of widgets (admittedly not as much as others out there)
  • Broadest set of targeted devices
  • Works equally well on desktops
  • Best chance for long term maintenance
  • Huge community already formed in it’s first alpha release (like me)
  • Easy to customize
  • Can’t beat the price

Backed by jQuery

It’s associated and backed by jQuery! Need anyone say more?  I mean honestly jQuery’s success is rather astounding.  You can find it being used by Google, Microsoft, Adobe,etc. Which means when using jQuery Mobile you can continue to use all the jQuery API’s and plugins that you’ve come to learn and love.  The learning materials on jQuery is probably the richest of any JavaScript framework out there.  I mean even w3schools has a dedicated jQuery tutorial, you don’t find that about any of the others.

Besides name recognition and familiar API’s the jQuery name gives highest chance for long term maintenance and community support (See last two bullet points)

Good Looking UI

Let’s be honest, if it wasn’t for the good looking touch capable UI’s most of the mobile framework API’s would be ignored completely.  Sure, AJAX page loading is nice, and swipe events are great, but the UI is really what’s people see.  jQuery Mobile looks good.  It’s implements nice CSS3 effects like gradients, shadows, and rounded corners, with fall backs for browsers that don’t support them.  In reality the CSS is where all the action is, most of the time the JavaScript just selectively adds and removes classes.  Efforts were made to be touch friendly, so buttons are big, check-boxes are easy to strike, and icons are given padding.

Really easy to use

If you are like me working at a company that does not want to cutting edge, but would rather deliver results quickly and at a low cost, the administration does not really care about all the techno. stuff.  Throw in a whole team of workers that need to maintain, customize and expand on your code, learning curve is really important. jQuery Mobile delivers here with an intuitive structure.  The one thing that takes time getting used to, is the heavy reliance on html5 data-x tags.

Decent set of widgets

The widget set of jQuery Mobile is pretty comparable to other frameworks and is even sometimes lacking compared to others.  But it provides the most needed ones. Some crucial features like a carousel/scroll windows are missing but a presumably this is limited by mobile limitations on scroll windows.  Although experimental solutions are out there.  The JQM teams seems to be focusing on getting what they have stable before adding any new widgets.

Broadest set of targeted devices

This has been the main goal since the beginning, aim high but account for low.  Their infamous device browser grid shows this.  Can’t say it looks great on older devices (try opening it in ie8) but not too bad either.  Besides if you need to target specific devices most likely workarounds are out there.  Like to add rounded corners and shadows in IE8.

Works equally well on desktops

In my current project I started targeting for mobile phones, only to have my requirements change to laptops (with optimistic support for adaptive layouts for phones)!  No bother, app still looks great on desktops, tablets and phones.  Just need to add a lot of data-inline=”true” and add a more restrictive container div with a max-width.  Otherwise the all your forms and buttons will take up the whole width!

Best chance for long term maintenance

With some corporate sponsors in place, and the jQuery name behind it, there is a great chance that this will continue to evolve with full time involvement of web developers.

Huge community

In open source projects community is crucial.  If there is no interest, the creators also lose interest.  Communities find and fix bugs, spread the word, create plugins, help materialize sponsors and add features. Active communities are also crucial so creating tutorials, books, and forum questions and answers to ensure more attraction to framework.

Easy to customize

The built-in CSS is nice, but almost definitely you will want some other colors besides, yellow, blue, grey and black.  Until the theme-roller is released hopefully with version 1, http://www.mobjectify.com/ has done a good job to fill in the gap of easy custom CSS coding, and galleries which you can copy.  Even without any tools it’s a just a matter of copy paste into your own css file. In your code it’s just a matter of setting data-theme=”x”. My current app bears only structural resemblance to the built-in styles.

Can’t beat the price

Isn’t the MIT licence great?  Years of man hours free for the taking?  Hard to believe but true.


While some of the points in jQuery Mobile favor also equally apply to the other frameworks, I think most of these hold stronger for JQM.  For me though the community support and lofty clearly stated goals set it apart in the end.