jQuery.each vs _.each vs for loop

JavaScript performance comparison

Revision 27 of this test case created by Mark Statkus

Info

I was interested if the 'len' outside the for loop made a difference, since it seemed to make a huge difference in this test.

Preparation code

<script src="//code.jquery.com/jquery-git2.min.js"></script>
<script src="//underscorejs.org/underscore-min.js"></script>
<script src="//rawgithub.com/lodash/lodash/2.4.1/dist/lodash.min.js"></script>
<script>
  var lodash = _.noConflict();
  var array = $('*').get();
</script>
<script>
Benchmark.prototype.setup = function() {
    var $ = window.$;
    var _ = window._;
    var lodash = window.lodash;
   
    var e;
    var array = window.array;
};
</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(array, function(index, element) {
  e = element;
});
pending…
underscore.each
_.each(array, function(element, index, list) {
  e = element;
});
pending…
lodash.each
lodash.each(array, function(element, index, list) {
  e = element;
});
pending…
for loop
for (var i = 0, len = array.length; i < len; i++) {
  e = array[i];
}
pending…
forEach
array.forEach(function(element) {
  e = element;
});
pending…
while1
var i = 0;
while (i++ < array.length) {
  e = array[i];
}
pending…
while2
var i = 0, len = array.length;
while (i < len) {
  e = array[i];
  i += 1;
}
pending…
while3
while ((element = array.shift()) !== undefined) {
  e = element;
}
pending…
for 2
for (var i = 0; i < array.length; i++) {
  e = array[i];
}
pending…
jQuery.each 2
$.each(array, function() {
  e = this;
});
pending…
for 3
var i, len = array.length;
for (i = 0; i < len; i += 1) {
  e = array[i];
}
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