jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.
jsperf.com URLs are mirrored at the same path, e.g:
https://jsperf.com/negative-modulo/2
Can be accessed at:
https://jsperf.app/negative-modulo/2
Ben Alman says - "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!"
But this implementation has very dangerous impact whenever you'll need to perform nested iterations on jQuery collections - you would no way got a pointer to the outer element from the inner loop, since it gets rewritten by your inner element. This could face you up to data loss (which I had, unfortunately).
I've noticed that to Striker21, who made modified quickEach, which is safe, and perform same.
See it in action.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
(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);
(function($)
{
$.fn.quickEach = function(c)
{
var j = $([0]), i = -1, l = this.length;
while(
++i < l
&& (j[0] = this[i])
&& c.call(j, i, j[0]) !== false
);
return this;
};
})(jQuery);
// Create a whole bunch of elements for iteration.
var elems = $('<div/>').append(Array(1000).join('<span/>')).children();
</script>
Ready to run.
Test | Ops/sec | |
---|---|---|
jQuery each2 plugin |
| ready |
jQuery core .each method |
| ready |
jQuery quickEach plugin |
| ready |
You can edit these tests or add more tests to this page by appending /edit to the URL.