Benchmark: Measure Iterator overhead

Script Preparation code:

function filter(iterable, predicate) {
    const iter = iterable[Symbol.iterator]();
    
    return {
        [Symbol.iterator]() {
            return this;
        },
        next() {
            let result;
          
          	while (
              !(result = iter.next()).done &&
              !predicate(result.value)
            );
          
          	return result;
        }
    };
}

function* filterGenerator(iterable, predicate){
    for (const value of iterable) {
        if (predicate(value)) {
            yield value;
        }
    }
}

var arr = Array(100).fill(0).map((_, i) => i + 1);

Tests:

Loop with conditions
for (const value of arr) { if (value % 3 === 0 && value % 5 === 0) { console.log('foobar'); } }
Iterator
for (const value of filter(arr, (x) => x % 3 === 0 && x % 5 === 0)) { console.log('foobar'); }
Generator
for (const value of filterGenerator(arr, (x) => x % 3 === 0 && x % 5 === 0)) { console.log('foobar'); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Loop with conditions
Iterator
Generator

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 YaBrowser/24.4.0.0 Safari/537.36

Browser/OS: Yandex Browser 24 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Loop with conditions	66278.0 Ops/sec
Iterator	60564.1 Ops/sec
Generator	62787.6 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down what's being tested in this benchmark and the different approaches compared.

**Benchmark Definition**

The benchmark measures the overhead of iterating over an array using three different approaches:

1. **Classic `for` loop with conditions**: This approach uses a traditional `for` loop to iterate over the array, but with a condition to filter out certain elements.
2. **Iterator object**: This approach creates an iterator object from the array and then iterates over it using the `next()` method.
3. **Generator function**: This approach defines a generator function that yields elements from the array, which can be iterated over like a regular iterable.

**Options Compared**

The benchmark compares the performance of these three approaches:

* Classic `for` loop with conditions
* Iterator object
* Generator function

**Pros and Cons of Each Approach**

1. **Classic `for` loop with conditions**:
	* Pros: Simple, easy to understand, and familiar for developers.
	* Cons: Can be slow due to the overhead of checking the condition inside the loop.
2. **Iterator object**:
	* Pros: Efficient use of resources, as it only iterates over the array once.
	* Cons: Requires understanding of iterators and their implementation details.
3. **Generator function**:
	* Pros: Lightweight, efficient, and easy to understand for developers familiar with generators.
	* Cons: May not be suitable for older browsers or environments that don't support generators.

**Library and Its Purpose**

There is no explicit library mentioned in the benchmark definition. However, the use of `Symbol.iterator` suggests that the JavaScript engine is using a built-in iterator implementation. The generator function uses a custom implementation to create a generator.

**Special JS Feature or Syntax**

The benchmark uses generators, which are a feature introduced in ECMAScript 2015 (ES6). Generators provide an efficient way to implement iterators and are used here to compare their performance with the classic `for` loop approach.

**Other Considerations**

When running benchmarks like this, it's essential to consider factors such as:

* Browser version support: Ensure that the benchmark is run on browsers that support all three approaches.
* Environmental variables: Control for any environmental variables that might affect performance (e.g., CPU frequency, memory allocation).
* Compiler optimizations: Avoid using compiler optimizations that might influence the results.

**Alternatives**

If you're interested in exploring alternative approaches to iteration, consider:

1. **Array.prototype.forEach()**: A simple and efficient way to iterate over an array.
2. **Array.prototype.map()** and **Array.prototype.filter()**: Can be used to transform arrays without explicitly iterating over them.
3. **WebAssembly modules**: Could potentially provide a performance boost for certain use cases.

Keep in mind that the choice of iteration approach depends on the specific requirements of your project, such as compatibility with older browsers or devices, and the desired level of complexity.

Related benchmarks:

Measure Iterator overhead (version: 0)

Comparing performance of: Loop with conditions vs Iterator vs Generator

Created: one year ago by: Registered User

Jump to the latest result

Loop with conditions

Iterator

Generator

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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