Info

Basically, if you're going to do $(this) inside an .each loop, you should consider using the jQuery each2 plugin instead, because it's specifically optimized for this extremely common use case!

Preparation code

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

<!-- the plugin -->
<script src="http://github.com/cowboy/jquery-misc/raw/master/jquery.ba-each2.js"></script>

<script>
  // Create a whole bunch of elements for iteration.
  var elems = $('<div/>').append(Array(1000).join('<span/>')).children();
</script>

Preparation code output

Test runner

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

Java applet disabled.

elems.each2(function(i, jq) {
 jq; // Use at will!
 jq; // No performance penalty.
 jq; // No performance penalty.
});

elems.each(function(i, elem) {
 var jq = $(this); // This is the best we can do here.
 jq; // No performance penalty.
 jq; // No performance penalty.
 jq; // No performance penalty.
});

elems.each(function(i, elem) {
 $(this); // Really inefficient code, you know,
 $(this); // like you see all over the web...
});

elems.each(function(i, elem) {
 $(this); // Really inefficient code, you know,
 $(this); // like you see all over the web...
 $(this); // Etc...
 $(this); // Etc...
});

elems.each(function(i, elem) {
 for (var i = 0; i < 10; i++) {
  $(this); // Let's see the cost of doing $(this) 10x.
 }
});

elems.each2(function(i, jq) {
 // This should give some sense of how disproportionate the
 // $(this) savings are compared to actual DOM manipulations.
 jq.addClass('foo');
});

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:

• Revision 1: published by "Cowboy" Ben Alman on 3rd August 2010
• Revision 2: published by "Cowboy" Ben Alman on 3rd August 2010
• Revision 3: published on 3rd August 2010
• Revision 4: published by David on 3rd August 2010
• Revision 5: published by David on 3rd August 2010
• Revision 6: published by Kyle Simpson on 3rd August 2010 and last updated on 4th August 2010
• Revision 7: published by Flatlineato on 4th August 2010
• Revision 13: published by Scott Rycroft on 22nd March 2011
• Revision 15: published by Scott Rycroft on 23rd March 2011
• Revision 16: published by Jason DiMeo on 21st October 2011
• Revision 18: published by Jason DiMeo on 22nd October 2011
• Revision 22: published by creage on 31st March 2012
• Revision 23: published on 31st March 2012
• Revision 24: published on 1st April 2012
• Revision 25: published on 2nd April 2012

1 comment