Fastest array loops in Javascript

JavaScript performance comparison

Revision 65 of this test case created by S.

Info

Note for v35; EXACT copy of v34, but the first & last tests are swapped. No other changes were made.

Testing the best overall performers (across both desktop and mobile) from these jsperf tests:

Caching array length

Different kinds of loop

Interestingly, it would seem that current 2012 browsers have all optimized their Javascript engines for basic for and while loop syntax. This means we can probably abandon all the 'trick' loops (that used to run faster) and just go with whatever loop syntax we find the most readable.

Preparation code

<script>
  // Populate the base array
  var arr = [];
  for (var i = 0; i < 1000; i++) {
    arr[i] = i;
  }

  function someFn(ix) {
    return ix * 5 + 1 / 3 * 8;
  }
</script>
<script>
Benchmark.prototype.setup = function() {
    for (var i = 0; i < 1000; i++) {
        arr[i] = i;
      }
};
</script>

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
While length--
var l = arr.length;
while (l--) {
  someFn(arr[l]);
}
pending…
While loop, basic
var i = 0;
while (i < arr.length) {
  someFn(arr[i]);
  i++;
}
pending…
For loop, cached
for (var i = 0, len = arr.length; i < len; i++) {
  someFn(arr[i]);
}
pending…
Order
while (i = arr.shift()) {
  someFn(i);
}
pending…
order validation
while ((i = arr.shift()) !== undefined) {
  someFn(i);
}
pending…
For loop, basic
for (var i = 0; i < arr.length; i++) {
  someFn(arr[i]);
}
pending…
forEach
arr.forEach(function(val, index, ar) {

  someFn(val);

});
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment