• jQuery 1.4.3 / jQuery 1.4.4
• Ofﬁcial Plugins:
• jQuery Templating
• jQuery Data Linking
• jQuery Mobile
• Traversal Performance
• HTML 5 Data
• Tool written by Douglas Crockford
• With more commits coming in, helps to
enforce basic style guidelines
• Completely integrated into our
development workﬂow: make lint
• All jQuery modules can now be individually
• Could use a script loader to load each ﬁle
• Allows us to avoid building jQuery to run
the test suite.
• Massive rewrite of the CSS module.
• Focus on extensibility.
• (A bit of performance too!)
• Plugins already using it: jQuery Rotate
Firefox 3.6 Firefox 4b7 Chrome Safari 5 Opera 10.6 IE 8 IE 9b
jQuery1.4.3 Elem .ﬁnd()(Time in milliseconds - lower is better)
HTML 5 Data
• HTML 5 has this new concept of data-
• <div data-role=”page”></div>
• You can give them any name, it doesn’t
matter, your page will validate.
• We added support for this in 1.4.3.
• Dramatically simplify the process of
extracting data from a form and updating it.
• Another plugin developed in conjunction
with devs at Microsoft.
• New ofﬁcial templating plugin.
• Provide a simple way of putting data into an
• Developed in conjunction with devs at
I’ve been researching and trying to make
sense of the mobile space recently.
Started preparations in 2009 (with the creation of TestSwarm).
Cross-browser mobile web development is crazy.
(...but not nearly as crazy as it use to be.)
A Simple Goal
✤ Started with a simple goal:
✤ To make sure that jQuery works on the most popular mobile
platforms and browsers.
✤ As it turns out, it’s really hard to deﬁne the scope of the problem.
✤ Three questions that need to be answered before doing mobile
✤ What platforms and browsers are popular?
✤ What browsers are capable of supporting modern scripting?
✤ What devices and simulators do I acquire to test with?
✤ To answer those questions we need good data.
✤ Who has the best statistics on the mobile market?
✤ StatCounter and Gartner seem to be tops.
✤ StatCounter covers billions of hits per month.
✤ Gartner is well-respected and knows sale information well.
✤ AdMob is decent for speciﬁc platforms (iPhone, Android).
✤ That being said: Very little actually-useful information leaks out.
Lack of Information
✤ Right now ﬁnding this information is a challenge.
✤ As a result, developers develop for what’s in front of them:
✤ What versions of those browsers are popular?
✤ No one seems to know, or isn’t talking about it.
✤ Supposedly Yahoo is going to be releasing some
information soon, we’ll see.
✤ Right now it’s considered to be a competitive
advantage to keep it private.
✤ Draw a line in the sand
✤ Buy Devices, Download Simulators
✤ Automate testing (TestSwarm!)
Drawing a Line
✤ Yahoo!s Graded Browser Support technique is optimal.
✤ Qualify which browsers you will support (actively test against) and
give them a grade.
✤ A = Full support, C = Fall back to old site, Other = Assume full
Mobile Graded Browser Support: Market share + Browser quality
✤ Two options:
✤ Buy devices and/or
✤ Download simulators
✤ Simulators are good for most automated testing.
✤ Any sort of interaction testing you’ll want to do on a physical device.
✤ Always good to do a sanity check on a physical device before going
✤ Simulators are available for most platforms and browsers.
✤ Most simulators require Windows to run (some require Perl or
✤ Some browsers even provide standalone executables (Opera, Fennec).
✤ Getting the simulators running can be a real bear.
✤ Once you have simulators (or physical devices) up and running you’ll
want to interact with them as little as possible.
✤ Automated test execution will be really important.
✤ TestSwarm was developed for this express purpose: Make it easy to
push tests out to a large number of clients (even mobile).
The Missing Gap
• Almost all mobile web development
focuses on modern WebKit
• There are far too many other platforms
• Blackberry, Opera,Windows Mobile,
Mobile Firefox, Symbian, etc.
• jQuery Mobile works everywhere - and
without sacriﬁcing experience.
Phase 1: jQuery Core
• We’re working to make jQuery core work
on all the popular mobile browsers.
• Building out our test suite and continuous
• Using TestSwarm to automate our testing
across all platforms.
• Fixing mobile bugs in core.
Phase 2: jQuery Mobile
• A complete framework for building mobile
web sites and applications.
• Provide all the widgets and layout
components necessary to build mobile
• Built on the principles of progressive
• How does jQuery Mobile compare to
jQTouch or Sencha Touch?
• jQuery Mobile is all about progressive
• Works on many more devices.
• Has a smaller ﬁle size (13KB)
• More information: