Testing jQuery.fn.each vs Native Loop
HTML
<ul>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is a li</li>
<li>This is...
JavaScript
var console = {
times:{},
time:function(name){
this.times[name] = +new Date();
},
timeEnd:function(name){
$(document.body).append('<div>'+name+' : '+((+new Date()) - this.times[name])+' ms</div>');
}
};
var selector = "@(ul li)";
var jqSelector = selector.substring(2, selector.length - 1);
var components = $(jqSelector);
var ids = [];
console.time('Native Loop');
var length = components.length;
for(var i=0; i < length; i++) {
ids[length] = $(components[i]).attr('id');
}
console.timeEnd('Native Loop');
console.time('jQuery Each');
components.each(function() {
ids.push($(this).attr('id'));
});
console.timeEnd('jQuery Each');