jQuery 3 vs jQuery 2 (v83)

Revision 83 of this benchmark created on

Preparation HTML

<script src="https://code.jquery.com/jquery-2.0.3.min.js"></script>
<script>
  var jQ1 = jQuery.noConflict();
</script>
<script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>

<script>
  var jQ2 = jQuery.noConflict();
</script>
<div id="idSelector"></div>
<div class="classSelector"></div>
<ul id="iteration">
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>
<div id="cssGetter" style="color: black;"></div>
<div id="cssSetter" style="color: black;"></div>
<div id="find">
    <span></span>
    <div>
        <strong></strong>
    </div>
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
ID Selector jQuery 3
jQ1('#idSelector');
ready
ID Selector jQuery 2
jQ2('#idSelector');
ready
Class Selector jQuery 3
jQ1('.classSelector');
ready
Class Selector jQuery 2
jQ2('.classSelector');
ready
Iteration jQuery 3
jQ1('#iteration li').each(function(i, e) {
  i++;
});
ready
Iteration jQuery 2
jQ2('#iteration li').each(function(i, e) {
  i++;
});
ready
CSS Getter jQuery 3
jQ1('#cssGetter').css('color');
ready
CSS Getter jQuery 2
jQ2('#cssGetter').css('color');
ready
CSS Setter jQuery 3
jQ1('#cssSetter').css('color', 'red');
ready
CSS Setter jQuery 2
jQ2('#cssSetter').css('color', 'red');
ready
Find jQuery 3
jQ1('#find').find('strong');
ready
Find jQuery 2
jQ2('#find').find('strong');
ready
Non-existent ID jQuery 3
jQ1('#someID');
ready
Non-existent ID jQuery 2
jQ2('#someID');
ready
Non-existent Class jQuery 3
jQ1('.someClass');
ready
Non-existent Class jQuery 2
jQ2('.someClass');
ready
Filter-next-prev jQuery 3
jQ1('#iteration li').filter(':first').next();
jQ1('#iteration li').filter(':last').prev();
ready
Filter-next-prev jQuery 2
jQ2('#iteration li').filter(':first').next();
jQ2('#iteration li').filter(':last').prev();
ready

Revisions

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