Benchmark: for vs forEach vs for-of vs for-reverse vs reduce (calculate sum)

Script Preparation code:

var array = Array.from({length: 100}, (_, index) => index);

Tests:

for
var sum = 0 for (var i = 0; i < array.length; i++) { sum += array[i]; }
forEach
var sum = 0 array.forEach(function(item) { sum += item; });
for-of
var sum = 0 for (var item of array) { sum += item; }
for-reverse
var sum = 0 for (var i = array.length; i--;) { sum += array[i]; }
reduce
var sum = array.reduce((sum, item) => sum + item, 0)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for
forEach
for-of
for-reverse
reduce

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 years ago)

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

Browser/OS: Chrome 120 on Windows

View result in a separate tab

reduce

6.6M/s

for-of

5.6M/s

forEach

4.0M/s

for-reverse

154K/s

for

79K/s

View exact numbers

Test name	Executions per second
✓ reduce	6,602,774 Ops/sec
for-of	5,644,932 Ops/sec
forEach	3,955,648 Ops/sec
for-reverse	154,496 Ops/sec
for	78,949 Ops/sec

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

LLMs can make mistakes. Check important info.

The provided JSON represents a benchmark test case created on MeasureThat.net, which compares the performance of different JavaScript loop constructs: for, forEach, for-of, and for-reverse. The test case also includes a reduce method for comparison.

Here's an explanation of each option:

1. **For Loop**: This is a traditional loop construct that uses a counter variable to iterate over an array.
	* Pros:
		+ Well-established and widely supported by most browsers.
		+ Can be used with traditional indexing (e.g., `array[i]`) or with traditional for loops (e.g., `for (var i = 0; i < array.length; i++)`).
	* Cons:
		+ Can lead to off-by-one errors if not used carefully.
		+ Not as concise as other options.
2. **forEach Loop**: This loop construct is part of the ECMAScript standard and allows iterating over an iterable (such as an array) without manual indexing.
	* Pros:
		+ Concise and expressive syntax.
		+ Reduces risk of off-by-one errors.
	* Cons:
		+ Not supported by older browsers or those with limited JavaScript implementations.
3. **for-of Loop**: This loop construct is also part of the ECMAScript standard and provides a more concise way to iterate over an array than traditional for loops.
	* Pros:
		+ More concise than traditional for loops.
		+ Reduces risk of off-by-one errors.
4. **for-reverse Loop**: This loop construct uses the `--` operator to decrement a counter variable, making it more concise and easier to read than traditional for loops with manual indexing.
5. **Reduce Method**: This method is used to reduce an array to a single value by applying a callback function to each element in sequence.
	* Pros:
		+ Concise syntax.
		+ Reduces risk of off-by-one errors.

The test case measures the performance of these different loop constructs and methods on various devices and browsers. The results show that:

* For-reverse loops are generally the fastest, followed closely by for-of loops.
* Traditional for loops can be slower than other options due to manual indexing and potential off-by-one errors.
* forEach loops provide a good balance between conciseness and performance.

Other alternatives that could be used instead of these loop constructs include:

* **While Loops**: Another traditional loop construct that uses conditional statements to control iteration.
* **For-in Loops**: Used for iterating over object properties, not arrays.
* **Array.prototype.every()** or **Array.prototype.some()**, which can be used for filtering and aggregation tasks.

However, since the test case is specifically designed to compare the performance of loop constructs and methods in array iteration, these alternatives are not considered part of the primary comparison.

for vs forEach vs for-of vs for-reverse vs reduce (calculate sum) (version: 0)

for vs forEach vs for-of vs for-reverse vs reduce (calculate sum)

Comparing performance of: `for vs forEach vs for-of vs for-reverse vs reduce`

Created: 4 years ago by: Guest

Go to the latest result

for

forEach

for-of

for-reverse

reduce

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 forEach vs for-of vs for-reverse vs reduce (calculate sum) (version: 0)

for vs forEach vs for-of vs for-reverse vs reduce (calculate sum)

Comparing performance of: for vs forEach vs for-of vs for-reverse vs reduce

Created: 4 years ago by: Guest

Go to the latest result

for

forEach

for-of

for-reverse

reduce

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 vs forEach vs for-of vs for-reverse vs reduce`