Benchmark: For vs for of vs forEach

Script Preparation code:

var array = new Array(100000);

Tests:

for loop
let value; for (var i = 0; i < array.length; i++) { value = array[i]; }
forEach
let value; array.forEach(function(i) { value = i; });
for of
let value; for (var i of array) { value = i; }
reduce
const value = array.reduce((prev, current) => current, null)

Historical Performance Data aggregated from 48 community runs

Desktop Results:

Chrome 25 runs

for of

20K/s

forEach

10K/s

reduce

7K/s

for loop

5K/s

Fastest: for of (4.0x faster)

View exact numbers

✓ for of: 20,306 ops/sec
• forEach: 9,616 ops/sec
• reduce: 7,301 ops/sec
• for loop: 5,048 ops/sec

Firefox 12 runs

reduce

11K/s

forEach

8K/s

for loop

7K/s

for of

2K/s

Fastest: reduce (6.4x faster)

View exact numbers

✓ reduce: 10,558 ops/sec
• forEach: 8,087 ops/sec
• for loop: 7,346 ops/sec
• for of: 1,652 ops/sec

Safari 5 runs

for loop

36K/s

for of

14K/s

forEach

778/s

reduce

776/s

Fastest: for loop (46.4x faster)

View exact numbers

✓ for loop: 35,996 ops/sec
• for of: 14,373 ops/sec
• forEach: 778 ops/sec
• reduce: 776 ops/sec

Mobile Results:

Chrome 6 runs

forEach

4K/s

for loop

3K/s

reduce

2K/s

for of

2K/s

Fastest: forEach (2.5x faster)

View exact numbers

✓ forEach: 3,857 ops/sec
• for loop: 2,574 ops/sec
• reduce: 2,439 ops/sec
• for of: 1,551 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for loop
forEach
for of
reduce

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/146.0.0.0 Mobile Safari/537.36

Browser/OS: Chrome Mobile 146 on Android

View result in a separate tab

for of

28K/s

forEach

6K/s

reduce

5K/s

for loop

4K/s

View exact numbers

Test name	Executions per second
✓ for of	27,997 Ops/sec
forEach	5,611 Ops/sec
reduce	4,679 Ops/sec
for loop	3,687 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 definition and test cases.

**Benchmark Definition**

The benchmark measures the performance of three different loops in JavaScript: `for`, `for...of`, and `forEach`. The script preparation code creates an array of 100,000 elements. The benchmark is designed to test which loop executes faster.

**Options Compared**

The options being compared are:

* `for`: a traditional `for` loop that uses a counter variable (`i`) to iterate over the array.
* `for...of`: a newer `for` loop syntax that uses an iterator expression (`array[i]`) to iterate over the array.
* `forEach`: a method call on the array that iterates over its elements using a callback function.

**Pros and Cons**

1. **For Loop**
	* Pros: widely supported, easy to understand and implement.
	* Cons: can be slower than newer loop syntaxes due to the overhead of incrementing the counter variable.
2. **For...of Loop**
	* Pros: more concise and expressive, eliminates the need for explicit counter variables.
	* Cons: may have performance implications due to the use of iterator expressions.
3. **forEach Loop**
	* Pros: concise and easy to read, eliminates the need for explicit loops.
	* Cons: may not be as efficient as traditional `for` or `for...of` loops.

**Library and Purpose**

None of the test cases explicitly use a library or third-party function. The performance tests are designed to measure the native JavaScript engine's performance.

**Special JS Feature or Syntax**

There is no special JavaScript feature or syntax used in these benchmarks. All three loop options are standard features of the language.

**Alternative Loop Options**

Other alternative loop options that could be included in a benchmark like this include:

* `while`: a traditional `while` loop that iterates over the array.
* `map()`: a method call on the array that creates a new array with transformed elements.
* `filter()`: a method call on the array that creates a new array with filtered elements.

These alternative options could be included to provide a more comprehensive understanding of the performance characteristics of different JavaScript loops and iteration methods.

For vs for of vs forEach (version: 0)

Comparing performance of: `for loop vs forEach vs for of vs reduce`

Created: 3 years ago by: Guest

Go to the latest result

for loop

forEach

for of

reduce

Historical Performance Data aggregated from 48 community runs

Desktop Results:

Chrome 25 runs

Firefox 12 runs

Safari 5 runs

Mobile Results:

Chrome 6 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

For vs for of vs forEach (version: 0)

Comparing performance of: for loop vs forEach vs for of vs reduce

Created: 3 years ago by: Guest

Go to the latest result

for loop

forEach

for of

reduce

Historical Performance Data aggregated from 48 community runs

Desktop Results:

Chrome 25 runs

Firefox 12 runs

Safari 5 runs

Mobile Results:

Chrome 6 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `for loop vs forEach vs for of vs reduce`