Benchmark: Jquery versions Benchmarch

HTML Preparation code:

<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>

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
  var $jq18 = $.noConflict(true);
</script>

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script>
  var $jq19 = $.noConflict(true);
</script>

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">
</script>
<script>
  var $jq112 = $.noConflict(true);
</script>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js">
</script>
<script>
  var $jq224 = $.noConflict(true);
</script>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>
<script>
  var $jq321 = $.noConflict(true);
</script>

Script Preparation code:

function tests($) {
  // Filter Next
  $('#iteration li').filter(':first').next();
  
  // Filter Prev
  $('#iteration li').filter(':last').prev();
  
  // Non-existant Class
  $('.someClass');
  
  // Non-existant ID
  $('#someID');
  
  // Find
  $('#find').find('strong');
  
  // Set color
  $('#cssSetter').css('color', 'red');
  
  // Get color
  $('#cssGetter').css('color');
  
  // Iteration
  $('#iteration li').each(function(i, e) {
    i++;
  });
  
  // Class selector
  $('.classSelector');
  
  // ID selector
  $('#idSelector');
}

Tests:

1.8.3
tests($jq18);
1.9.1
tests($jq18);
1.12.14
tests($jq112);
2.2.4
tests($jq224);
3.2.1
tests($jq321);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
1.8.3
1.9.1
1.12.14
2.2.4
3.2.1

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

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

Browser/OS: Chrome 135 on Windows

View result in a separate tab

Test name	Executions per second
1.8.3	28671.1 Ops/sec
1.9.1	29415.8 Ops/sec
1.12.14	42583.2 Ops/sec
2.2.4	43939.6 Ops/sec
3.2.1	40838.5 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

The provided benchmark is designed to test the performance of jQuery versions, specifically v1.8.3, v1.9.1, v1.12.14, v2.2.4, and v3.2.1.

**Benchmark Definition:**

The benchmark definition is a JavaScript function called `tests($)`, which takes a jQuery object `$` as an argument. The function contains various jQuery methods and selectors that are executed in sequence. These methods include:

* Filtering the first or last element of a list (`#iteration li.filter(':first').next()` and `#iteration li.filter(':last').prev()`)
* Selecting non-existent elements with classes or IDs (`$('.someClass')` and `$('#someID')`)
* Finding elements within other elements (`#find.find('strong')`)
* Setting and getting CSS styles (`$('#cssSetter').css('color', 'red')` and `$('#cssGetter').css('color')`)
* Iterating over a list of elements using `.each()` (`$('#iteration li').each(function(i, e) { i++; });`)
* Using class selectors (`$('.classSelector')`)
* Using ID selectors (`#idSelector`)

**Options Compared:**

The benchmark compares the performance of different jQuery versions under various conditions. The options compared are:

* Different jQuery versions (v1.8.3, v1.9.1, v1.12.14, v2.2.4, and v3.2.1)
* Execution frequency and performance

**Pros and Cons:**

The pros of this benchmark include:

* It provides a comprehensive test suite for jQuery versions
* It helps identify performance differences between various versions
* It allows for comparison with different execution frequencies

However, the cons include:

* The benchmark may be sensitive to browser-specific optimizations or caching issues
* The use of non-existent elements and IDs may not accurately reflect real-world usage scenarios
* The benchmark's focus on jQuery-only methods might neglect other factors that affect overall performance (e.g., JavaScript engine optimizations)

**Libraries Used:**

The benchmark uses jQuery libraries from different versions:

* `$.noConflict(true)` is used to initialize the library for each version, which helps isolate browser-specific issues.

**Special JS Features/Syntax:**

None of the special features or syntax are explicitly mentioned in the provided code. However, it's worth noting that some browsers may have specific optimizations or limitations for certain JavaScript constructs (e.g., `forEach` vs. `each()`).

**Latest Benchmark Results:**

The latest benchmark results show the performance of each jQuery version on a Windows desktop with Firefox 129:

| TestName | ExecutionsPerSecond |
| --- | --- |
| v2.2.4 | 146328.796875 |
| v1.12.14 | 142788.53125 |
| v1.8.3 | 127245.859375 |
| v3.2.1 | 122097.671875 |
| v1.9.1 | 107312.7109375 |

These results suggest that the newer jQuery versions (v2.2.4 and v3.2.1) outperform older versions, while v1.12.14 is close to v1.8.3 in terms of performance.

Related benchmarks:

Jquery versions Benchmarch (version: 2)

SImple benchmark of jQuery versions

Comparing performance of: 1.8.3 vs 1.9.1 vs 1.12.14 vs 2.2.4 vs 3.2.1

Created: 8 years ago by: Registered User

Jump to the latest result

1.8.3

1.9.1

1.12.14

2.2.4

3.2.1

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):