Comparing JavaScript loops performance (for, do while, for in)

February 24th, 2012

update:The Chrome results where so strange that I retook the tests again with more samples and averaged the results. Things look more reasonable now.

I always try to optimise code for the fastest speed possible. While playing with some javascript (the culprit is this marvelous game by @tonyvirtual called Chain Reaction) I started thinking about the different speed gains that one might get from using different kinds of loops. A basic for loop in javascript can be implemented in many ways but typical are these 3:

// Loop 1
for (var i=0; i < Things.length; i++) {
    // Do something with Things[i]
};
 
// Loop 2
var i = Things.length-1;
do {
// Do something with Things[i]
} while (i--);
 
// Loop 3
for (var i in Things){
// Do something with Things[i]
}

There are many online reports that favour one of the loops instead of the others, but I wasn’t convinced so I decided to test them myself. I devised a simple test that you can run in your browser or you can modified it by getting it from github.com and tested the script in 3 different browsers all on the Mac OS X 10.5.8. The browsers are Firefox 10.0.2, Safari 5.0.6 and Chrome 19.0.1049.3 dev so I don’t know if these will apply to other browsers or OSes (use the github file).

The JavaScript performance results are listed below in the format min (average 10x):

Firefox

Loop 1 (for ;;) — 117 (118.5)
Loop 2 (do – while) — 119 (125.9)
Loop 3 (for in) — 600 (671.6)

Safari

Loop 1 (for ;;) — 180 (185.8)
Loop 2 (do – while) — 178 (183.3)
Loop 3 (for in) — 1591 (1615.9)

Chrome

Loop 1 (for ;;) — 180 (191.2)
Loop 2 (do – while) — 159 (167.6)
Loop 3 (for in) — 585 (610.2)

JavaScript traditional for loop is the fastest

I am really surprised with these results. I knew that Mozilla had made some trick to make for loops fast, but I didn’t imagine that Firefox would beat the other two. Also the for in is to be avoided as it is slower. Convenience in this case comes at a price. I also was amazed on how bad the do-while loop performed under Chrome. I retook the test for Google Chrome and it now makes sense, the do-while is faster than the traditional one but still slower than Firefox’s.

I don’t understand this JavaScript performance differences but they certainly need more testing. The only conclusion until now is that the traditional javascript for loop is fast and should be used without second thoughts. You can test the loops in your own browser and see if the results match mine and then post the results in the comments below!

Related posts:

  1. The Best Python Performance. When Speed matters…
  2. Grande surpresa! Google Chrome no topo dos browsers

  • http://www.nonsensebb.com/ Dextro

    Ok, here goes mine. But first the specs: Windows 7 x64, Core 2 Duo @ 2.66GHz, 4gb ram.

    Firefox 12.0a2: Loop 1 (for ;;) — 195 Loop 2 (do – while) — 182 Loop 3 (for in) — 884

    Chrome 17.0.963.56: Loop 1 (for ;;) — 184 Loop 2 (do – while) — 178 Loop 3 (for in) — 664

    IE9: Loop 1 (for ;;) — 232 Loop 2 (do – while) — 233 Loop 3 (for in) — 668

    IE9 x64: Loop 1 (for ;;) — 674 Loop 2 (do – while) — 647 Loop 3 (for in) — 1185

    Safari 5.0.4: Loop 1 (for ;;) — 263 Loop 2 (do – while) — 269 Loop 3 (for in) — 1673

    Opera 11.61: Loop 1 (for ;;) — 440 Loop 2 (do – while) — 533 Loop 3 (for in) — 769

    What surprises me the most is the Opera performance, that’s seriously weak!

    EDIT: my mistake, it’s IE9 and not IE10 obviously

  • http://www.facebook.com/tonyvirtual António Lopes

    All on Mac OS X 10.7.3:

    Safari: Loop 1 (for ;;) — 141 Loop 2 (do – while) — 142 Loop 3 (for in) — 1450

    Firefox: Loop 1 (for ;;) — 77 Loop 2 (do – while) — 75 Loop 3 (for in) — 671

    Chrome: Loop 1 (for ;;) — 209 Loop 2 (do – while) — 205 Loop 3 (for in) — 681

  • http://www.sixhat.net/ DavidR.

    I think there’s some bug in my Chrome Do While test… I’m retaking it again right now

  • http://www.sixhat.net/ DavidR.

    I’m really surprised with IE10 x64 vs IE10. It seems that the 64bit version is 4 times slower! Also Opera results are strange… very slow…

  • http://www.sixhat.net/ DavidR.

    Your Firefox is fast! Damn…

  • http://www.nonsensebb.com/ Dextro

    Oops, my mistake. I ran IE9 and not 10. In fact on IE9 there were two distinct JS engines: Chackra that’s 32bits only and the old one whose name I can’t recall that was used in IE8 and is still used on IE9′s 64bits version. That explains the differences and it’s why I did both tests.