Benchmark: javascript loops (foreach, for-in, for-of, for, map, reduce) 1000 items

Tests:

foreach
const items = Array.from({length: 1000}, () => Math.floor(Math.random() * 40)); let index = 0; items.forEach(i => index++);
for-in
const items = Array.from({length: 1000}, () => Math.floor(Math.random() * 40)); let index = 0; for (let i in items) { index++; }
for-of
const items = Array.from({length: 1000}, () => Math.floor(Math.random() * 40)); let index = 0; for (let i of items) { index++; }
for
const items = Array.from({length: 1000}, () => Math.floor(Math.random() * 40)); let index = 0; for(let i = 0; i < items.length; ++i) { index++; }
optimized-for
const items = Array.from({length: 1000}, () => Math.floor(Math.random() * 40)); let index = 0; for(let i = items.length; i > 0; --i) { index++; }
map
const items = Array.from({length: 1000}, () => Math.floor(Math.random() * 40)); items.map((_, i)=> i++);
reduce
const items = Array.from({length: 1000}, () => Math.floor(Math.random() * 40)); items.reduce((acc, curr)=> acc++, 0);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
foreach
for-in
for-of
for
optimized-for
map
reduce

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 27 days ago):

LLMs can make mistakes. Check important info.

I'm ready to dive into the world of JavaScript microbenchmarks.

**Benchmark Overview**

The provided benchmark measures the performance of six different looping constructs in JavaScript: `forEach`, `for-in`, `for-of`, `for`, and two optimized versions (`optimized-for` and an unspecified variant). The test case generates an array of 1000 random numbers and iterates over it using each looping construct.

**Looping Constructs Compared**

Here's a brief overview of the loop constructs compared in the benchmark:

1. **`forEach`**: Iterates over an array using the `forEach` method, which calls the provided callback function for each element in the array.
2. **`for-in`**: Iterates over an array-like object (in this case, the generated array) using a traditional `for` loop with `in` syntax.
3. **`for-of`**: Iterates over an array using the `for...of` loop syntax, which is a more modern and concise way of iterating over arrays.
4. **`for`**: Similar to `for-in`, but uses a traditional `for` loop without `in` syntax.
5. **`optimized-for`**: This variant uses a manual index variable to iterate over the array, bypassing the need for `forEach` or `map`.
6. **(Unspecified variant)**: This option is skipped in the benchmark.

**Pros and Cons of Each Approach**

Here are some general pros and cons of each looping construct:

* **`forEach`**: Pros: concise, easy to read; Cons: can be slower due to function call overhead.
* **`for-in`**: Pros: widely supported, but can lead to issues with array-like objects; Cons: less readable than other options.
* **`for-of`**: Pros: modern, concise syntax; Cons: may not work as expected in older browsers or environments.
* **`for`**: Pros: simple, easy to understand; Cons: less readable than `forEach` or `for-of`.
* **`optimized-for`**: Pros: can be faster due to manual index variable; Cons: more error-prone and less readable.

**Library Used**

None of the benchmark tests use any external libraries. The loops are executed directly within the JavaScript interpreter.

**Performance Results**

The benchmark results show that:

* `forEach` is slower than all other options.
* `for-in` and `for-of` have similar performance, with slight variations depending on the browser.
* `for` is faster than both `foreach` and `for-in`.
* `optimized-for` is the fastest option, followed closely by an unspecified variant (which was skipped in this benchmark).

Overall, the results suggest that the choice of looping construct can impact performance, but also consider readability and maintainability.

Latest run results:

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

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

Browser/OS: Chrome 126 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
foreach	6336.6 Ops/sec
for-in	6325.1 Ops/sec
for-of	6768.1 Ops/sec
for	6760.9 Ops/sec
optimized-for	6773.0 Ops/sec
map	6692.1 Ops/sec
reduce	6739.4 Ops/sec

Related benchmarks:

javascript loops (foreach, for-in, for-of, for, map, reduce) 1000 items (version: 0)

Comparing performance of: foreach vs for-in vs for-of vs for vs optimized-for vs map vs reduce

Created: 8 months ago by: Guest

Jump to the latest result

foreach

for-in

for-of

for

optimized-for

map

reduce

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 27 days ago):