Benchmark: jquery 1.12.4 vs 2.2.4 vs 3.7.1 vs 4.0.0

HTML Preparation code:

<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<script>
  var $jq1124 = $.noConflict(true);
</script>
<script src="https://cdn.jsdelivr.net/npm/jquery@2.2.4/dist/jquery.min.js"></script>
<script>
  var $jq224 = $.noConflict(true);
</script>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script>
<script>
  var $jq371 = $.noConflict(true);
</script>
<script src="https://cdn.jsdelivr.net/npm/jquery@4.0.0/dist/jquery.min.js"></script>
<script>
  var $jq400 = $.noConflict(true);
</script>
<div>
  <ul id="menu">
    <li class="menu-item">1</li>
    <li class="menu-item">2</li>
    <li class="menu-item">3</li>
    <li class="menu-item">4</li>  
    <li class="menu-item">5</li>  
    <li class="menu-item">6</li>  
    <li class="menu-item">7</li>  
    <li class="menu-item">7</li>  
    <li class="menu-item">7</li>  
    <li class="menu-item">7</li>  
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li> 
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li>
    <li class="menu-item">7</li> 
  </ul>
</div>

Script Preparation code:

function tests($) {
    $(".menu-item").eq(2).closest("ul").css({
      "background-color": "red"
    }).parent().css({
      "border": "1px solid blue"
    }).append($("<p></p>").text("Text.").css({
      "background-color": "green"
    })).end().end().remove();
  console.log('tests' + $);
}

Tests:

jQuery 1.12.4
tests($jq1124);
jQuery 2.2.4
tests($jq224);
jQuery 3.7.1
tests($jq371);
jQuery 4.0.0
tests($jq400);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
jQuery 1.12.4
jQuery 2.2.4
jQuery 3.7.1
jQuery 4.0.0

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 months ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/144.0.0.0 Safari/537.36 Edg/144.0.0.0

Browser/OS: Chrome 144 on Windows

View result in a separate tab

Test name	Executions per second
jQuery 1.12.4	38703.0 Ops/sec
jQuery 2.2.4	54258.3 Ops/sec
jQuery 3.7.1	47908.3 Ops/sec
jQuery 4.0.0	47436.6 Ops/sec

Related benchmarks:

jquery 1.12.4 vs 2.2.4 vs 3.7.1 vs 4.0.0 (version: 1)

Comparing performance of: jQuery 1.12.4 vs jQuery 2.2.4 vs jQuery 3.7.1 vs jQuery 4.0.0

Created: 2 months ago by: Guest

Jump to the latest result

jQuery 1.12.4

jQuery 2.2.4

jQuery 3.7.1

jQuery 4.0.0

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A