Benchmark: while vs for vs forEach vs for of - 1000000 - calc

Script Preparation code:

var arr =new Array(10000);

Tests:

while
let i=0; while(i < arr.length) { const exp = arr[i] ** 2; i++; }
for
for(let i=0; i<arr.length; i++) { const exp = arr[i] ** 2; }
forEach
arr.forEach((element) => { const exp = element ** 2; });
for of
for(const element of arr) { const exp = element ** 2; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
while
for
forEach
for of

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/126.0.0.0 Safari/537.36

Browser/OS: Chrome 126 on Linux

View result in a separate tab

Test name	Executions per second
while	969.7 Ops/sec
for	892.2 Ops/sec
forEach	84817.3 Ops/sec
for of	338432.1 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested.

The benchmark compares four different approaches to iterate over an array of length 10,000:

1. **While loop**: This approach uses a traditional `while` loop with a conditional statement to check if the index is within the bounds of the array.
2. **For loop**: This approach uses a traditional `for` loop with an initialization, condition, and increment clause to iterate over the array.
3. **forEach method**: This approach uses the `forEach` method provided by modern JavaScript arrays, which allows iterating over an array without explicit indexing or looping logic.
4. **For-of loop**: This is a relatively new feature introduced in ECMAScript 2015 (ES6), which provides a concise way to iterate over arrays and other iterable objects using a `for...of` loop.

**Options being compared:**

The benchmark compares the performance of each approach on a specific test case, which calculates the square of each element in the array using exponentiation (`arr[i] ** 2`). The goal is to measure the execution time (in executions per second) for each approach.

**Pros and cons of each approach:**

1. **While loop**:
	* Pros: flexible, easy to understand, and can be used for more complex iterations.
	* Cons: may lead to performance issues due to unnecessary checks and conditional branching.
2. **For loop**:
	* Pros: straightforward, easy to read, and well-established in most programming languages.
	* Cons: may have performance overhead due to the explicit initialization, condition, and increment clauses.
3. **forEach method**:
	* Pros: concise, readable, and optimized for array iteration by modern JavaScript engines.
	* Cons: may not be suitable for non-array data structures or more complex iterations.
4. **For-of loop**:
	* Pros: concise, easy to read, and optimized for array iteration.
	* Cons: relatively new feature, which might lead to compatibility issues in older browsers or environments.

The `for...of` loop is the clear winner in this benchmark, with an execution time significantly lower than the other approaches. This is likely due to its optimized nature and the fact that it's specifically designed for array iteration.

**Library usage:**

There is no explicit library used in these test cases. However, modern JavaScript engines like Chrome provide optimizations for the `forEach` method, which contributes to its improved performance in this benchmark.

**Special JS features or syntax:**

The **for-of loop** introduced in ES6 is a special feature that allows iterating over arrays and other iterable objects using a concise syntax. It's not a library per se, but rather a new syntax added to the language.

Overall, this benchmark provides valuable insights into the performance characteristics of different iteration approaches in JavaScript. The results can help developers choose the most suitable approach for their specific use cases and optimize their code accordingly.

Related benchmarks:

while vs for vs forEach vs for of - 1000000 - calc (version: 0)

Compare the new ES6 spread operator with the traditional concat() method and push

Comparing performance of: while vs for vs forEach vs for of

Created: 4 years ago by: Guest

Jump to the latest result

while

for

forEach

for of

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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