Benchmark: for vs forEach vs for in vs for of

Script Preparation code:

var arr = [];

function doMath(a) {
  return Math.log(a);
}

for(i=0; i<5; i++){
  arr[i] = i + 1;
}

Tests:

forEach
let sum = 0; arr.forEach((value) => { sum += doMath(value); });
for in
let sum = 0; for(const index in arr) { sum += doMath(arr[index]); }
for
let sum = 0; for(var i = 0; i < arr.length; i++) { const value = arr[i]; sum += doMath(value); }
for of
let sum = 0; for(const value of arr) { sum += doMath(value); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
forEach
for in
for
for of

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 142 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
forEach	19164918.0 Ops/sec
for in	7206603.0 Ops/sec
for	22850208.0 Ops/sec
for of	27898054.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Measuring the performance of different JavaScript loops is an essential task for any developer, especially when optimizing code.

**Loop Comparison**

The provided JSON represents a benchmark that compares four different loop constructs:

1. `for`: A traditional loop using an index variable (`i`).
2. `forEach`: An iteration method that calls a callback function on each element in the array.
3. `for...in`: A loop that iterates over the properties of an object (not directly applicable to arrays, but used here for comparison).
4. `for...of`: A new loop construct introduced in ECMAScript 2015, iterating over iterable objects.

**Options Comparison**

Each loop has its pros and cons:

* `for`:
	+ Pros: Easy to understand, works well with arrays, and provides a clear exit condition.
	+ Cons: Can be slow due to the overhead of incrementing and decrementing indices.
* `forEach`:
	+ Pros: Encapsulates the iteration logic, making it easier to read and maintain code. It's also more memory-efficient since it doesn't require storing indices or objects in variables.
	+ Cons: May incur a performance penalty compared to traditional loops, especially for large datasets.
* `for...in`:
	+ Pros: Suitable for iterating over object properties, but not directly applicable to arrays. Can be useful when working with complex data structures.
	+ Cons: Not suitable for iterating over arrays or other iterable objects that don't have a property named "0".
* `for...of`:
	+ Pros: Specifically designed for iterating over arrays and other iterable objects, making it the most efficient option for these use cases. It also provides better support for async iteration.
	+ Cons: Requires support for ECMAScript 2015 (or later) and may require additional setup for asynchronous iterations.

**Library Considerations**

In this benchmark, none of the loops rely on any external libraries besides `Math` for the `doMath` function. However, some libraries might provide more efficient or optimized loop implementations, such as:

* V8 (the JavaScript engine used by Chrome) has its own internal optimizations and compiler optimizations that can impact loop performance.
* Some libraries, like React or Angular, use their own looping mechanisms that might be faster or more efficient than traditional loops.

**Special JS Features/Syntax**

This benchmark uses ECMAScript 2015 features:

* `let` and `const` declarations for variable scope management.
* The `for...of` loop syntax for iterating over arrays.
* Template literals (`\r\n`) for line continuation.

These features are widely supported in modern browsers and JavaScript engines, but might not work in older environments or with certain libraries.

**Other Alternatives**

If you need to optimize loop performance further, consider the following alternatives:

* Use a Just-In-Time (JIT) compiler like V8 or SpiderMonkey to analyze and optimize your code.
* Explore alternative looping mechanisms, such as Web Workers for parallel processing or async/await for asynchronous iterations.
* Profile your code using tools like Chrome DevTools or Node.js Inspector to identify performance bottlenecks.

In summary, the choice of loop construct depends on the specific use case, personal preference, and the trade-offs between performance, readability, and maintainability.

Related benchmarks:

for vs forEach vs for in vs for of (version: 0)

for vs forEach vs for in vs for of

Comparing performance of: forEach vs for in vs for vs for of

Created: 6 years ago by: Guest

Jump to the latest result

forEach

for in

for

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):