jQuery 1.2.6: Events 100% faster

Posted on by

jQuery 1.2.6 is primarily a bug fix release for jQuery 1.2. You can view the full list of what was fixed on the bug tracker.

This is the next release immediately following jQuery 1.2.3. Releases 1.2.4 and 1.2.5 were skipped (1.2.4 was built incorrectly, rendering it effectively identical to 1.2.3, and 1.2.5 was missing a patch).

The entire jQuery team did a fantastic job in pulling this release together – I want to take this opportunity to thank them all for their continued hard work.

I’d also like to take this opportunity to welcome Ariel Flesler to the core jQuery development team. He provided valuable help in pulling this release together – contributing bug fixes, performance improvements, features, and test cases. You can see the result of his hard work all throughout this release. Welcome Ariel and thank him for all his contributions!

Downloading

jQuery 1.2.6:

If you wish to checkout the full release from the Subversion repository, you can do so by following the instructions and checking out the source from the following location:

svn co http://jqueryjs.googlecode.com/svn/tags/1.2.6

Performance Improvements

Once again the jQuery team has worked hard to bring huge performance improvements in this release. As with previous releases we’ve expanded to look at many areas of the jQuery framework, looking for common pain points, and providing relief.

All data and test cases for the below performance improvements can be found in the the following jQuery 1.2.3 v. 1.2.6 Google Spreadsheet (results for Internet Explorer 6 were excluded in favor of Internet Explorer 7 due to their virtually-identical results).

Event Handling is 103% Faster

In analyzing intense application code (specifically operations such as drag-and-drop) we looked for ways in which universal changes could be made that would affect all users. A frequently-called piece of code was that of the jQuery event handler, any optimizations to it would dramatically improve the performance of all resulting frequently-called events. By focusing improvements here all frequently-called events that you have should see immediate benefits.

CSS Selectors are 13% faster

A number of optimizations have been made to internal jQuery methods, dramatically improving their performance, while providing measurable benefit to some of the most commonly used code in jQuery (such as the CSS Selector code).

For example the jQuery.map() method is now 866% faster and jQuery.extend() is 19% faster. These two changes have allowed for dramatic improvements in performance all throughout the library.

.offset() is 21% faster

Together with the improvements to jQuery’s event handling code optimizations of .offset() have allowed intense mouse-based operations to become much faster. For example jQuery UI’s drag-and-drop code is now over 300% faster because of these change (allowing you to achieve faster, smoother, drag-and-drop operations).

.css() is 25% faster

A method that’s frequently called (both internally and externally). The optimizations to this method are easily felt in others (like .offset(), for example).

New Features and Major Changes

Dimensions Plugin is Now Part of Core

The remaining methods of the Dimensions plugin, by Brandon Aaron, have been introduced into jQuery core, along with additional bug fixes and performance improvements. This plugin has seen considerable use amongst developers and plugin authors and has become a solid part of the jQuery ecosystem. We’ve been, slowly, introducing the most-used methods from the Dimensions plugin over the past couple releases – but with the release of 1.2.6 all remaining methods are now part of core.

If you’re upgrading your copy of jQuery to version 1.2.6 you can now opt to exclude the Dimensions plugin from your code.

The full documentation for Dimensions can be found on the jQuery documentation site (and is in the process of becoming integrated with the core jQuery documentation).

.attr() overhaul

The .attr() method has been completely overhauled (resolving about 15 outstanding bugs). Additionally, the method has been significantly simplified and optimized.

.toggle() can now accept more functions

Historically jQuery’s .toggle() function has accepted two functions (to be toggled in an even/odd manner). However that has been changed so that any number of functions can be provided and toggled by a mouse click.

$("div").toggle(function(){
  $(this).removeClass("three").addClass("one");
}, function(){
  $(this).removeClass("one").addClass("two");
}, function(){
  $(this).removeClass("two").addClass("three");
});

You can now unbind bound .toggle() and .one() functions

function test(){ $(this).addClass("test"); }
$("div").one("click", test);
$("div").unbind("click", test);

$("div").toggle(test, test);
$("div").unbind("click", test);

.index() supports jQuery collections

jQuery’s .index() function has allowed you to find the location of a DOM element in the jQuery collection – now you can also specify a jQuery collection (the first element of which will be extracted and located in the original set).

var test = $("div.test");
$("div").index( test ) == 3

jQuery.makeArray can convert ANYTHING to an array.

jQuery’s internal .makeArray() method now converts any array-like object into a new array. Additionally it wraps all other objects as an array and returns the resulting set.

jQuery.makeArray( document.getElementsByTagName("div") )
// => [ div, div, div ]

jQuery.makeArray( true )
// => [ true ]

jQuery.makeArray()
// => []

beforeSend can cancel Ajax calls

The beforeSend Ajax callback has allowed developers to execute a piece of code prior to a request occurring – now that code can also verify the integrity of some parameters and cancel the resulting Ajax request (useful for tasks like form validation).

$.ajax({
  beforeSend: function(){
    return $("#input").val() == "";
  },
  url: "test.php"
});

Exposed Speeds

jQuery has a number of named animation speeds (such as ‘slow’, ‘fast’, and ‘default’) you can now provide your own names for animation speeds, or modify the existing ones, by manipulating the jQuery.fx.speeds object.

jQuery.fx.speeds.slow = 1000;
$("#test").slideDown("slow");

42 thoughts on “jQuery 1.2.6: Events 100% faster”

  1. Aceman on said:

    I am impressed. Keep up the good work. jQuery is the best Javascript Library out there, lean and fast. I love it.

  2. Duane Johnson on said:

    Nice work, thank you! jQuery has made my (coding) life so much better. Oh, and for anyone who hasn’t seen it, check out the livequery plugin, too.

  5. Joshua Davey on said:

    Wow! I think performance updates might be my favorite updates because I don’t need to do anything and all of a sudden my site is twice as fast. Great work!

  7. Takuan Daikon on said:

    Woo!!! Because I’m working on a production app with a lot of “custom” tweaks and in-house fixes to many of my javascript libs (most of which use jQuery internally or as an option, like Ext-JS), I was quite nervous about upgrading, but it was almost a drop-in replacement.

    I did have to use the compatibility plugins (I was using 1.1 previously) and make a tweak to adapt the dequeue function for interface.js, but everything else was completely painless, and I get to enjoy the bug fixes and enhanced performance across the board.

    Thanks for all of the hard work guys, it is VERY much appreciated!!!

  8. Roshan Bhattarai on said:

    wow……..you guyz are really doing great……I always like jquery and love using this framework…I can’t wait to use the faster jquery…thanks a lotttt for this guyz

  9. Don Charlton on said:

    I am amazed at how simple jquery is. I tip my hat to you guys, for real.

  12. Corey Dutson on said:

    I love the fact that something is 866% faster. It doesn’t even matter how bad it may have been before; 866% improvement to ANYTHING is impressive.

    Keep up the good work!

  14. Przemek Sobstel on said:

    Using Google to serve jquery (http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js) is really good option, especially if you can’t set compressing on your server (lack of mod_defalte etc). Also, if more developers use it, then you will take even bigger advantage of caching (there’s a chance that jquery will load directly from cache then, even if someone visits your site for the first time). YUI takes advantage of it already.

  18. devolute on said:

    The developer I work with is all over this. With news like this, I’m glad that I too recommend it to my friends.

  21. Eran Galperin on said:

    I’m curious, what were the changes that sped up the event handling to twice as fast? or rather what was slowing them down?
    And as usual, great work guys. jQuery has been my favourite JS framework for a long time and it just keeps getting better.

  22. John Resig on said:

    @Eran: We spent a lot of time fixing cross-browser event issues in inefficient ways. Namely for every single event we were jQuery.extend-ing the original event object into a new object. Improving the performance of extend helped but so did optimizing the code to cherry-pick the exact things that we wanted to fix.

  24. Evan on said:

    This is great. I’m especially glad you combined dimensions it was too fundamental to leave out. thank you!

  25. sheshnjak on said:

    It’s nice to know that you guys are adding new things into framework, but I hope that this is not the start of code bloating. Since first day I started using jQuery it was obvious that it was a start of a beautiful friendship. When I started using jQuery my eyesight improved, heartbeat increased & my appetite is much better. Thanks guys, great work on jQuery!

  27. Mohammed on said:

    Thank you so much. JQuery singularly brought the love back for programming. All of you guys and especially Mr Resig are geniuses. I salute you sirs!

    Hip Hip! Hoorah!

  28. steve on said:

    Thanks for this. Will upgrade the lib at work first thing tomorrow! Even though, tbpfh, we barely use it yet…

    To be frank, jquery is about the only thing that keeps me interested in my web dev job at all, right now. Most every other aspect, I’m really disenchanted and don’t much care to keep battering on the same old crap (that I already know) or learning it (the stuff I don’t). But jquery just… “smells” damn cool. Looking forward to pushing myself and learning it much more deeply when I rebuild our main site over the next few months.

  32. Chris on said:

    @Vader

    You don’t happen to know a Darth Vader do you?

    I haven’t seen him since high school. Tell him I said “what’s up?”! Thanks!

  33. michele on said:

    Great, thanks for everything you’re doing!

    And thanks for fixing attr(), it caused me some headaches under IE (coupled with form tags) and I always forgot to open a ticket but you already fixed it so thanks again! ;-)

  34. Chris Missal on said:

    I’m quite new to using jQuery, but I’m really excited to get into all the great stuff I’ll be able to do with it. Kudos jQuery Team!!

  35. Cory S.N. LaViska on said:

    This is great. It keeps getting better and better. Thanks especially for integrating the dimensions plugin into the core :)

  36. pRtkL xLr8r on said:

    I just started using jQuery a few months ago, and I can’t believe how amazing it is. Not only has it made my life with JavaScript 100x easier, it has also replaced my use of xajax — not that it’s bad, it just doesn’t have the power and flexibility jQuery has in regards to AJAX (JSON being a huge one).

    If there was some sort of annual award for best piece of software technology, you’d certainly get my vote…

  38. xwisdom on said:

    Well I can’t be left out of this! :) Thanks a lot for this release. I have noticed a performance increase jQuery based apps.

    jQuery is Simply The Best!

    Thanks to jQuery Team! I just Love it!

    How about some jQuery T-shirts, key-chains, pens, cups, etc? I would be willing to buy a few to help promote the lib

  39. seagull on said:

    Without jQuery we would have at least spent twice the time developing our site and not to mention the performance improvements.
    Thanks for such an wonderful library. You guys rock.

  41. Mike Gale on said:

    I’m intrigued by your way of measuring improvements.

    In my book 103% improvement in timing means that something finishes before you ask it to start.

    I assume your calculation involves taking the “after” time and dividing it into the “before” time then subtracting 100%.

  42. Kristof on said:

    Congrats to the best jQuery ever…

    Is it possible to update the jQuery documentation in the next couple of weeks?

    It’s because I (and many more .NET programmers) use the doc’s for creating a header file for Visual Studio 2008 Intellisense. (see http://www.infobasis.com/sandpit/jQuery-Intellisense – InfoBasis JQuery IntelliSense Header Generator).