Benchmark: for vs foreach vs for..of vs for..of over entries vs for in vs for cache vs for reverse

Script Preparation code:

var array = Array.from({length: 100});
var t;

AخA
 
var array = Array.from({length: 100});var t;

Tests:

for

for (let i = 0; i < array.length; i++) {
  t = array[i];
}

 
for (let i = 0; i < array.length; i++) {  t = array[i];}

foreach
array.forEach(function(v, i) { t = v; });
array.forEach(function(v, i) {
t = v;
});
for..of
for (var v of array) { t = v; }
for (var v of array) {
t = v;
}
for..of over entries
for (var [i, v] of array.entries()) { t = v; }
for (var [i, v] of array.entries()) {
t = v;
}
for..in
for (var k in array) { t = array[k]; }
for (var k in array) {
t = array[k];
}
for cache length
for (let i = 0,len = array.length; i < len; i++) { t = array[i]; }
for (let i = 0,len = array.length; i < len; i++) {
t = array[i];
}

for reverse

for (let i = array.length - 1; i >= 0; i--) {
  t = array[i];
}

 
for (let i = array.length - 1; i >= 0; i--) {  t = array[i];}

while

let i=0,len = array.length
while(i < len){
  t = array[i]
  i++
}

 
let i=0,len = array.lengthwhile(i < len){  t = array[i]  i++}

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
for
foreach
for..of
for..of over entries
for..in
for cache length
for reverse
while

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/120.0.0.0 Safari/537.36

Browser/OS: Chrome 120 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
for	89543.0 Ops/sec
foreach	224603.5 Ops/sec
for..of	226733.9 Ops/sec
for..of over entries	212760.2 Ops/sec
for..in	112232.5 Ops/sec
for cache length	129762.6 Ops/sec
for reverse	129815.3 Ops/sec
while	129743.4 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 4 months ago):

Let's dive into the world of JavaScript loop performance benchmarking.

What is tested?

The provided JSON represents a set of test cases that compare the performance of different looping constructs in JavaScript:

Traditional for loop
foreach (also known as forEach() or Array.prototype.forEach())
for..of loop
for..of over entries loop
for...in loop
Cache length optimization (for cache length) loop
Reverse iteration (for reverse) loop

Each test case measures the execution time of a specific looping construct on a pre-allocated array.

Options compared

The benchmark compares the performance of each looping construct, providing insight into which one is the most efficient.

Pros and Cons:

Traditional for loop: This is a basic loop construct that can be slow due to overhead from incrementing an index variable.
- Pros: Easy to understand and implement.
- Cons: Can be slower than other constructs.
foreach: A more modern looping construct that avoids indexing issues.
- Pros: Less error-prone, faster execution time compared to traditional for.
- Cons: May have performance overhead due to function call.
for..of loop: A concise and expressive way to iterate over arrays.
- Pros: Faster execution time compared to traditional for, fewer potential errors.
- Cons: Requires modern JavaScript engines that support this syntax (Chrome 120+ in this case).
for..of over entries: Similar to the previous one, but uses the .entries() method to iterate over an array's index and value pairs.
- Pros: More explicit control over iteration, potentially faster execution time.
- Cons: Requires additional function call overhead.
for...in loop: Iterates over an object's properties (not arrays) using property names as indices.
- Pros: Fast execution time for iterating over objects.
- Cons: Not suitable for array iterations and may have unexpected behavior.

Cache length optimization

This construct uses a variable to store the array length, reducing the number of iterations required.

Pros: Can be faster in certain scenarios due to reduced iterations.

Cons: May require additional memory allocation, potentially leading to performance degradation.

Reverse iteration

Iterates over an array in reverse order.

Pros: Interesting edge case for testing, might reveal unexpected behavior.

Cons: Not suitable for most use cases and can lead to performance overhead.

Other considerations

Keep in mind that the benchmark is specific to Chrome 120+ and may not be representative of other JavaScript engines or environments. Additionally, the performance differences between these constructs can vary depending on the specific use case and array size.

Overall, this benchmark provides a comprehensive view of the different looping constructs in JavaScript, helping developers understand which ones are most efficient for their use cases.

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript loop performance benchmarking.

**What is tested?**

The provided JSON represents a set of test cases that compare the performance of different looping constructs in JavaScript:

1. Traditional `for` loop
2. `foreach` (also known as `forEach()` or `Array.prototype.forEach()`)
3. `for..of` loop
4. `for..of over entries` loop
5. `for...in` loop
6. Cache length optimization (`for cache length`) loop
7. Reverse iteration (`for reverse`) loop

Each test case measures the execution time of a specific looping construct on a pre-allocated array.

**Options compared**

The benchmark compares the performance of each looping construct, providing insight into which one is the most efficient.

**Pros and Cons:**

1. **Traditional `for` loop**: This is a basic loop construct that can be slow due to overhead from incrementing an index variable.
	* Pros: Easy to understand and implement.
	* Cons: Can be slower than other constructs.
2. `foreach`: A more modern looping construct that avoids indexing issues.
	* Pros: Less error-prone, faster execution time compared to traditional `for`.
	* Cons: May have performance overhead due to function call.
3. `for..of` loop: A concise and expressive way to iterate over arrays.
	* Pros: Faster execution time compared to traditional `for`, fewer potential errors.
	* Cons: Requires modern JavaScript engines that support this syntax (Chrome 120+ in this case).
4. `for..of over entries`: Similar to the previous one, but uses the `.entries()` method to iterate over an array's index and value pairs.
	* Pros: More explicit control over iteration, potentially faster execution time.
	* Cons: Requires additional function call overhead.
5. `for...in` loop: Iterates over an object's properties (not arrays) using property names as indices.
	* Pros: Fast execution time for iterating over objects.
	* Cons: Not suitable for array iterations and may have unexpected behavior.

**Cache length optimization**

This construct uses a variable to store the array length, reducing the number of iterations required.

Pros: Can be faster in certain scenarios due to reduced iterations.

Cons: May require additional memory allocation, potentially leading to performance degradation.

**Reverse iteration**

Iterates over an array in reverse order.

Pros: Interesting edge case for testing, might reveal unexpected behavior.

Cons: Not suitable for most use cases and can lead to performance overhead.

**Other considerations**

Overall, this benchmark provides a comprehensive view of the different looping constructs in JavaScript, helping developers understand which ones are most efficient for their use cases.

Related benchmarks:

for vs foreach vs for..of vs for..of over entries vs for in vs for cache vs for reverse (version: 0)

Compare loop performance

Comparing performance of: for vs foreach vs for..of vs for..of over entries vs for..in vs for cache length vs for reverse vs while

Created: one year ago by: Guest

Jump to the latest result

for

foreach

for..of

for..of over entries

for..in

for cache length