I have to at least try to defend jQuery.  Based on recent selector tests, it beats all other libraries out there and the shorter syntax means I spend less time coding.  But I have to give it up to the POJ on the issue of loops in an array.

I conceded defeat early on simple arrays of numbers:

for(i=0; i < myArray.length; i++){
  myArray[i];
}

VS

$.each(myArray, function(i) {
  myArray[i];
});

After all, jQuery advertises “Find something [in the DOM] and do something with it” not “Find a number in an array.”

But then I completed this test:

var myArray = document.getElementsByTagName("DT");
var i = myArray.length;
while(i--){
    var elm = myArray[i];
    if(elm.firstChild){
        elm.firstChild.nodeValue=i;
    }else{
        elm.appendChild(document.createTextNode(i));
    }
}

VS

$("dt").each(function(i,e) {
    $(e).text(i);
});

jQuery got spanked. jQuery methods slowed IE 8 down the least and slowed FF 3.5 the most. How much slower did jQuery perform? Well, with 495 items to select and modify in a DOM of 1000 nodes, over 100 iterations, jQuery performed the same operation as plain old JavaScript 26 times slower in the fastest browser, Chrome 2.

But look at the difference in code. jQuery still reigns supreme for sexy, short syntax.

For the best performance, Chrome 2 ran twice as fast as FF 3.5 which performed 4-8 times faster than IE 8. Looks like POJ and Chrome FTW.

download the testing pages

If you will use a library anyway, it probably pays to use the selector engines like Sizzle, here’s a test to demonstrate that part:

Slick Speed Test

Be Sociable, Share!

•