each2 vs each vs quickEach (v39)

Revision 39 of this benchmark created by creage on

Preparation HTML

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

//each2
(function($) {
  
  // Create a placeholder jQuery object with a length of 1. The single item
  // is completely arbitrary and will be replaced.
  var jq = $([1]);
  
  $.fn.each2 = function( fn ) {
    var i = -1;
    
    while (
      // Set both the first element AND context property of the placeholder
      // jQuery object to the DOM element. When i has been incremented past the
      // end, this[++i] will return undefined and abort the while loop.
      ( jq.context = jq[0] = this[++i] )
      
      // Invoke the callback function in the context of the DOM element,
      // passing both the index and the placeholder jQuery object in. Like
      // .each, if the callback returns `false`, abort the while loop.
      && fn.call( jq[0], i, jq ) !== false
    ) {}
    
    // Return the initial jQuery object for chainability.
    return this;
  };
  
})(jQuery);

//quickEach
(function($)
{
	$.fn.quickEach = function(f)
	{
		var j = $([0]), i = -1, l = this.length, c;
		while(
			++i < l
			&& (c = j[0] = this[i])
			&& f.call(c, i, j) !== false
		);
		return this;
	};
})(jQuery);

(function($) {  
 
  $.fn.each3 = function( fn ) {
    var jq = $([1]), i = -1;
    
    while (
      // Set both the first element AND context property of the placeholder
      // jQuery object to the DOM element. When i has been incremented past the
      // end, this[++i] will return undefined and abort the while loop.
      ( jq.context = jq[0] = this[++i] )
      
      // Invoke the callback function in the context of the DOM element,
      // passing both the index and the placeholder jQuery object in. Like
      // .each, if the callback returns `false`, abort the while loop.
      && fn.call( jq[0], i, jq ) !== false
    ) {}
    
    // Return the initial jQuery object for chainability.
    return this;
  };
})(jQuery);

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

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery each2 plugin
elems.each2(function(i, jq) {
 jq;   // jQuery object
 this; // DOM element
});
ready
jQuery core .each method
elems.each(function(i, elem) {
 $(this); // jQuery object
 this;    // DOM element
});
ready
jQuery quickEach plugin
elems.quickEach(function(i, elem) {
 this; // jQuery object
 elem; // DOM element
});
ready
each3
elems.each3(function(i, jq) {
 jq;   // jQuery object
 this; // DOM element
});
ready
array for
for(var i=0,len = elems.length; i< len; i++){
var jq = elems[i]; 
}
ready

Revisions

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