Saturday, February 20, 2010

Recent jQuery Performance Updates

Now folks, you know, I was always saying "there is nothing like a smell of good statistics in the morning!". Now lets take a look at that 2x speed up claimed over here.

I'm using my Shakker util to perform the tests. You can also read why I don't use Taskspeed anymore.

So to the tests. Lets take a look at the Firefox test

Yea, kind a bit of speed up at claimed `bind`, `html` and `remove` methods, certainly not 2x, and note how it actually got slower at 1.4.1 and then gets back to almost the same values as 1.4.0.

Now lets take a look at the same thing at Safari

A different scale, the same picture, it's getting slower from 1.4.0 to 1.4.1 and then gets back to almost the same values at 1.4.2. No 2x speed up between 1.4.2 and 1.4.1, more of that almost no speed up at all and certainly no 3x speed up agains 1.3.2.

Well, lets get further and take a look at the test in another fine browser, Chrome.

The same exact picture with the `bind`, `html` and `remove` methods, got slower on 1.4.1 and to the same value at 1.4.2.

Now you should get back to that release notes page and ask yourself "why there are no results for version 1.4.0?".

Yup, because there is no speed up, they merely fixed their own fuckups in 1.4.1 and now present it as 2x speed boost.
Awesome! :)


Jose said...

Yes, that is the truth. Undeserved fame ...

Nikolay V. Nemshilov aka St. said...

@ Jose

I wouldn't go that far. imho John does pretty good job moving up not just jQuery, but JavaScript development as a profession as well.

I'm just having fun of their promotion techniques. That's all

psayre23 said...

I found that your $ function doesn't return correct results. IE returns named elements, as well as IDs. jQuery tests for this erroneous behavior and recovers the correct element through more expensive means.

It looks like your functions just uses the getElementById function. Your function is quite quick, but it is missing a check for this behavior. Compare Mozilla's with Internet Explorer's. Note that IE says "Returns the first object with the specified ID or NAME", while Mozilla says "Returns the element whose ID is specified." If you'd like a like to this behavior, I have an example in a sandbox that I can't publish online. Email me and I'll link you.

If would like to implement a quick check for this, I'd love to give you a hand. It will likely slow down your library a bit because of the ID lookup, but will make it functionally correct. I'd suggest something like this:

function $(element) {
if(typeof element === 'string') {
var id = element;
element = document.getElementById(id);
if(element && !== id) {
element = $$('#'+id)[0];
return element;

Nikolay V. Nemshilov aka St. said...

@ psayre23

Thanks for the heads up! I've scheduled a ticket, will handle it in the next version.