jQuery vs Underscore Each (v4)

Revision 4 of this benchmark created by Akos Lukacs on


Description

Is jQuery's $.each or Underscore's _.each faster if underscore is going through 53x as many elements?

Would be a fair test, if _(Modernizr), and $(Modernizr) would have the same number of elements...

Check the printed "items in xxx loop:" message...

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script src="//documentcloud.github.com/underscore/underscore-min.js">
</script>
<script src="//www.modernizr.com/downloads/modernizr-2.0.js">
</script>
<div id='len'>
</div>
<hr />
<div id="content">
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
Underscore.js Each
var $content = $('#content');
var len = 0;
_(Modernizr).each(function(value, property) {
  len++;
  $('<div/>', {
    id: property,
    css: {
      width: '100%'
    },
    html: property + ' ' + value
  }).appendTo($content);
});
if (!window.underscoreMessageSet) {
  window.underscoreMessageSet = true;
  $('#len').append('items in underscore loop: ' + len + '<br />');
}
ready
jQuery Each
var $content = $('#content');
var len = 0;
$(Modernizr).each(function(property, value) {
  len++;
  $('<div/>', {
    id: property,
    css: {
      width: '100%'
    },
    html: property + ' ' + value
  }).appendTo($content);
});
if (!window.jQueryMessageSet) {
  window.jQueryMessageSet = true;
  $('#len').append('item(s) in jQuery loop: ' + len + '<br />');
}
ready

Revisions

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