Although barely five years old, the jQuery JavaScript framework has a pretty good chance of standing the test of time. With one out of four websites using jQuery — including almost 40% of the world’s most popular websites — and the project developers showing no signs of slowing down, jQuery’s dominant position as the JavaScript framework of choice doesn’t appear to be facing any real competition for the foreseeable future.
Of course, success isn’t merely a function of longetivity. Rather, longetivity (and thus success) is a byproduct of those characteristics that contribute to product popularity. In this article I’ll highlight nine recent jQuery features that play no small role in jQuery’s past and future success. If you’re not familiar with jQuery, or perhaps are already a regular user but haven’t kept up with the latest developments, read through this list and even consider adding a few of your own in the reader comments!
1. jQuery Templating Plugin
Last month Microsoft contributed three plugins to the jQuery project: jQuery Templates, jQuery Data Link, and jQuery Globalization (I’ll talk about the latter two in subsequent sections). JQuery Templating remedies the inconvenience of mixing HTML tags and jQuery syntax when looping over data arrays or objects by organizing the HTML markup within a special template and then applying that template to the data via a callback function. The result is the ability to iterate over and mark up JavaScript arrays and objects without ever having to mingle the logic and presentation!
Scott Guthrie published a pretty succinct tutorial demonstrating the power of the jQuery Templating Plugin, which you can read here.
2. jQuery Data Link Plugin
The concept of data binding, or tying a set of user interface elements to a corresponding set of data object attributes is commonplace in the world of desktop applications. This incredibly useful feature is now available to jQuery users thanks to the jQuery Data Link plugin, which can bind an object’s property names to HTML elements as identified by their DIV IDs. Should the value associated with one end of the link change, so will the value at the other end. These endpoints are linked using the Data Link plugin’s linkBoth() method. For instance, the following snippet might be used to link a JavaScript object’s data to two fields found within an HTML form:
var account = {username: "wjgilmore", email: wj@example.com};
$(account) .linkBoth("username", "#username", "val") .linkBoth("email", "#email", "val")
With the binding in place, any changes made to either the JavaScript object or the associated HTML form fields will automatically cause the change to be made at the other end of the binding.
The Data Link Plugin was one of three plugins recently donated by Microsoft to the jQuery project. You can learn more about it here.
3. jQuery Globalization Plugin
Using the Web to market and sell products to a global audience is certainly appealing, yet many companies are woefully unprepared to present information to prospective foreign customers in a way that adheres to their customs and standards. The jQuery Globalization Plugin goes a long way towards helping localize any data originating from JavaScript to suit a country’s currency, data, and string formatting standards. The third of three plugins recently donated by Microsoft to the jQuery project, the Globalization Plugin already supports hundreds of locales, including Arabic, Greek, German, and Catalan.
4. cssHooks
The jQuery 1.4.3 release included a rethinking of how jQuery interacted with a page’s CSS properties, with a focus on the ability to extend the animate() and css() to your liking. Referred to as cssHooks, this new capability has many implications, including the means for overriding jQuery’s default animation presentation, creating cross-browser compliant effects or even creating entirely new effects altogether.
Core jQuery contributor Brandon Aaron is already assembling a collection of useful hooks, available for perusal and download over at GitHub.
5. jQuery Mobile
In August of this year the jQuery development team announced the jQuery Mobile Project. With the goal of allowing developers to “write once and run everywhere,” jQuery Mobile seeks to save developers from the headache of developing and maintaining multiple platform-specific applications and instead allow them to focus on writing a single universally accessible Web application.
With a very impressive 1.0 alpha release already available, the jQuery Mobile website offers a number of impressive demos and the typically outstanding documentation jQuery users have come to expect. But perhaps the most telling indicator of this project’s early success is the fact that the demo is user-friendly even on my Blackberry.
6. HTML5 Traction
JQuery 1.4.3 includes improvements to the data method, which in regards to HTML 5 now pulls HTML5 data attributes into the jQuery data object. Additionally, several plugins are already circulating, among them h5Validate, a plugin for validating HTML5 forms, and an HTML5 Canvas enhancement for jQuery Visualize.
7. Testing with QUnit
Although QUnit has been around for more than a year now, it still comes as a surprise to many developers that a unit testing framework is available for jQuery. Developed and maintained by jQuery creator John Resig and Jörn Zaefferer, QUnit is under active development and is available for perusal and download from GitHub.
8. Data Method Enhancements
The jQuery 1.4.3 release includes quite a few improvements, including the aforementioned change to the data method which results in HTML5 attributes being pulled into the jQuery data object. This isn’t the only change to this method in the 1.4.3 release. Additionally, you can now store data within Flash object tags and employ an interesting new way to directly access data- prefixed attributes. Sean Koole offers a pretty detailed breakdown of the changes made to the data method on this blog.
9. A Pretty Awesome Podcast
I’m not generally a fan of technology-specific podcasts (although I manage to listen to quite a few general technology podcasts such as This Week in Tech), however jQuery’s Official Podcast is a welcome exception. With a new episode posted every few weeks, recent regular guests include jQuery creator John Resig, jQuery UI lead developer Scott González, and other key team members. If your goal is to remain on the cutting edge of jQuery development, this podcast is required listening.
Conclusion
Like most things in life, longetivity is the enduring sign of success. The Roman Colosseum, chess, and The Rolling Stones are all synonymous with accomplishment, having been adored by the masses for thousands of years, and in Mick Jagger’s case, millions. Although the World Wide Web has been around for a decidedly shorter period of time, this barometer is already apparent even in the hyperactive technology space, with languages such as PHP, Python, and Java continuing to dominate the headlines more than 15 years after their respective releases. As these nine features show, the jQuery framework also is well poised to stand this test of time.
About the Author
Jason Gilmore is founder of the publishing and consulting firm WJGilmore.com. He is the author of several popular books “Easy PHP Websites with the Zend Framework”, “Easy PayPal with PHP”, and “Beginning PHP and MySQL, Fourth Edition”. Follow him on Twitter at @wjgilmore.
