Underscore.each vs jQuery.each vs. for loop vs. `Lo-Dash.each'

JavaScript performance comparison

Revision 94 of this test case created by Tyler Young

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>

<script src="//documentcloud.github.com/underscore/underscore-min.js">
</script>
<script>
window.underscore = _.noConflict();
</script>
<script src="https://raw.github.com/bestiejs/lodash/master/lodash.min.js">
</script>
<script>
window.lodash = _.noConflict();
</script>
 
<script>
  Benchmark.prototype.setup = function() {
    var $ = window.$,
        lodash = window.lodash,
        underscore = window.underscore;
    
    var a = [],
        newArray = [],
        pi = Math.PI;
    
    window.newArray = newArray;
    
    for (var i = 1, max= 100 ; i <= max ; i++) {
      a.push('Fundamental alert number ' + i);
    }
    
    
    
    function iterate( a, x ) {
        var s = x.toString();
        var d = s.indexOf('{');
        d = s.substr(0,d);
        s = s.substr( s.indexOf('{') );
        if ( /^\{\s*\[native code\]\s*\}\s*$/.test(s) )
                Array.prototype.forEach( a, x );
        var p = d.substring( d.indexOf('(') + 1, d.indexOf(')') );
        if ( p !== '' ) {
                p = p.split(',');
                p.unshift('Ω');
                p.push('for (var α = 0; α < '+a.length+'; ++α) { '+p[1]+' = Ω[α]; '+s+'}');
                (Function.apply(null,p))(a);
        } else {
                (new Function( 'for (var α = 0; α < '+a.length+'; ++α) '+s ))();
        }
    }
  };

  Benchmark.prototype.teardown = function() {
    newArray = [];
  };
</script>

Preparation code output

Test runner

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

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
jQuery.each
 
$.each(a, function(index, val) {
  newArray.push(
    val.replace('und', '')
      .replace(/me.*le/, '')
      .replace(/number\s(\d+)/, 'with deciblel level of $1dB')
  );
});
 pending…
good old for loop
 
for (var i = 0, len = a.length; i < len; i++) {
  newArray.push(
    a[i].replace('und', '')
      .replace(/me.*le/, '')
      .replace(/number\s(\d+)/, 'with deciblel level of $1dB')
  );
}
 pending…
underscore.each
 
underscore.each(a, function(item) {
  newArray.push(
    item.replace('und', '')
      .replace(/me.*le/, '')
      .replace(/number\s(\d+)/, 'with deciblel level of $1dB')
  );
});
 pending…
Lo-Dash each
 
lodash.each(a, function(item) {
  newArray.push(
    item.replace('und', '')
      .replace(/me.*le/, '')
      .replace(/number\s(\d+)/, 'with deciblel level of $1dB')
  );
});
 pending…
array prototype forEach
 
Array.prototype.forEach.call(a, function(item) {
  newArray.push(
    item.replace('und', '')
      .replace(/me.*le/, '')
      .replace(/number\s(\d+)/, 'with deciblel level of $1dB')
  );
});
 pending…
array forEach
 
a.forEach(function(item) {
  newArray.push(
    item.replace('und', '')
      .replace(/me.*le/, '')
      .replace(/number\s(\d+)/, 'with deciblel level of $1dB')
  );
});
 pending…
iterator hax (similar to Lo-Dash approach)
 
/*warning; removes scope, refers to window.newArray*/
iterate( a, function(item) {
  newArray.push(
    item.replace('und', '')
      .replace(/me.*le/, '')
      .replace(/number\s(\d+)/, 'with deciblel level of $1dB')
  );
});
 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