jQuery.each vs. for loop vs Ext.Array.each (v232)

Revision 232 of this benchmark created on

Description

Serious Test for common method for looping an array:

  • (native) classic for loop
  • (native) Array.forEach
  • .each from various frameworks: jQuery, Ext, underscore (original & fallback version)
  • emulation: Array.prototype.each

Array size: 1000 (array size for testing the true processing power, unusual but possible)

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/prototype/1/prototype.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script src="http://cdn.sencha.io/ext-4.1.0-gpl/ext-all.js">
</script>
<script src="https://raw.github.com/documentcloud/underscore/master/underscore.js">
</script>
<script>
  $.fn.forEach = Array.prototype.forEach;
  var extArrayEach = Ext.Array.each;
  Array.prototype.each = function(func){
      var array = this, 
          i = 0, 
          l = array.length;
      while(i < l) func(array[i], i, array), i++;
      return array
    };
 var breaker = {};
  _.forEach = function(obj, iterator, context) {
    if (obj == null) return;
    if (obj.length === +obj.length) {
      for (var i = 0, l = obj.length; i < l; i++) {
        if (iterator.call(context, obj[i], i, obj) === breaker) return;
      }
    } else {
      for (var key in obj) {
        if (_.has(obj, key)) {
          if (iterator.call(context, obj[key], key, obj) === breaker) return;
        }
      }
    }
  };
  //a static array.
  var a = [];
  for (var i = 0, len = 1000; i < len; i++) {
    a[i] = i;
  }
function makeid()
{
    var text = "";
    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";

    for( var i=0; i < 5; i++ )
        text += possible.charAt(Math.floor(Math.random() * possible.length));

    return text;
}

var b = {};
  for (var i = 0, len = 1000; i < len; i++) {
    b[makeid()] = i;
  }
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery.each
$.each(a, function(index, node) {
 var e = node;
 $(e).length;

});
ready
for loop
for (var i = 0, len = a.length; i < len; i++) {
 var e = a[i];
 $(e).length;
};
ready
forEach
a.forEach(function(node, index){
 var e = node;
 $(e).length;
});
ready
Ext.Array.each
extArrayEach(a, function(index, node) {
 var e = node;
 $(e).length;
});
ready
Array.prototype.each
a.each(function(node){
  var e = node;
 $(e).length;
})
ready
_.each
_.each(a, function(node, index){
  var e = node;
 $(e).length;
})
ready
_.each (fallback)
_.forEach(a, function(node, index){
  var e = node;
 $(e).length;
})
ready
jquery each obj
$.each(b, function(index, node) {
 var e = node;
 $(e).length;
});
ready
for obj
for(var index in b)
{
  var node = b[index];
 $(e).length;
}
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.