Benchmark: set vs array iteration for,for-of and values v3

Script Preparation code:

var a = [];
for (var i = 0; i <= 10000; i++) {
    a.push(i);
}
var b = new Set(a);

Tests:

array for-of
for (const x of a) { let z = x; }
set for-of
for (const x of b) { let z = x; }
array for
for (let i = 0; i < a.length; i++) { let x = a[i]; }
set values for-of
const v = b.values(); for (const x of v) { let z = x }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
array for-of
set for-of
array for
set values for-of

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 131 on Windows

View result in a separate tab

Test name	Executions per second
array for-of	519681.2 Ops/sec
set for-of	108421.9 Ops/sec
array for	919.2 Ops/sec
set values for-of	109745.1 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated one month ago):

LLMs can make mistakes. Check important info.

The benchmark titled **"set vs array iteration for,for-of and values v3"** compares the performance of different iteration methods on two data structures in JavaScript: an array and a Set.

### Data Structures:
1. **Array**:
   - An ordered collection of elements that can contain duplicate values.
   - In this benchmark, an array named `a` is created and populated with integers from 0 to 10,000.

2. **Set**:
   - A collection that can only contain unique values. It automatically removes duplicates.
   - A Set named `b` is created from the array `a`, containing the same integers but without any duplicates.

### Test Cases:
1. **Array for-of**:
   - **Benchmark Definition**: `for (const x of a) { let z = x; }`
   - This uses the `for-of` loop to iterate over the array `a`. The `for-of` loop is designed for iterating over iterable objects (like arrays), allowing for a clear and concise syntax.

2. **Set for-of**:
   - **Benchmark Definition**: `for (const x of b) { let z = x; }`
   - This tests the same `for-of` looping construct on the Set `b`, which is expected to yield similar benefits in iteration as with the array.

3. **Array for**:
   - **Benchmark Definition**: `for (let i = 0; i < a.length; i++) { let x = a[i]; }`
   - This uses a traditional `for` loop to iterate over the array `a`. It accesses elements by their index, which may be less readable compared to the `for-of` loop but is a common approach.

4. **Set values for-of**:
   - **Benchmark Definition**: `const v = b.values(); for (const x of v) { let z = x }`
   - Here, the `values()` method of the Set is called to create an iterator over its values, followed by iteration with `for-of`. This represents another method to achieve iteration over the elements of a Set.

### Performance Results:
- From the latest benchmark results, the performance (in terms of executions per second) is vastly different across the methods:
  - **Array for-of** is the fastest, with **519,681.1875 executions per second**.
  - **Set values for-of** and **Set for-of** perform similarly, yielding around **109,745** and **108,422** executions per second respectively.
  - The **Array for** performs significantly slower at **919.188** executions per second, indicating that the traditional indexed approach is not as efficient as the newer iteration constructs.

### Pros and Cons:
- **for-of**:
  - **Pros**: 
    - Clean and readable syntax.
    - Automatically handles different iterable object types (arrays and Sets).
  - **Cons**: 
    - May introduce slight overhead compared to indexed-based access for large datasets.

- **Traditional for loop**:
  - **Pros**: 
    - Provides direct access to elements and is predictable.
  - **Cons**: 
    - More verbose and less expressive than `for-of`, and its performance can lag behind.

### Alternatives:
- Other alternatives for iteration in JavaScript include:
  - **Array.prototype.forEach()**: A method that applies a function to each element in the array, but it doesn't support early exit (break) from the loop.
  - **while loop**: Another common approach for iteration that offers flexibility but often less readability.
  - **Functional programming methods (map, filter, etc.)**: High-level methods that can often be more expressive and easier to work with, though they might also have performance implications due to the creation of intermediate arrays and the necessity for callbacks.

This benchmark provides valuable insights into the efficiency of modern JavaScript iteration constructs compared to traditional methods, especially as developers should favor readability and performance in their applications.

Related benchmarks:

set vs array iteration for,for-of and values v3 (version: 1)

Comparing performance of: array for-of vs set for-of vs array for vs set values for-of

Created: one month ago by: Guest

Jump to the latest result

array for-of

set for-of

array for

set values for-of

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated one month ago):