Benchmark: flatten reduce vs for .. of vs for

Tests:

reduce
const flatten = (arr) => arr.reduce((acc, x) => { Array.isArray(x) ? flatten(x).forEach(y => acc.push(y)) : acc.push(x) return acc; }, []) const x = flatten([ [1,2,3], [ [4,5,6], [7,8,9], [[[[[10,11,12]]], [13,14,15]]] ], [[[[[[[[[[[16,17,18]]]]]]]]]]] ]);
for of
const flat = (argarr) => { const arr = [] for (const item of argarr) { if (Array.isArray(item)) arr.push(flat(item)) else arr.push(item) } return arr } const x = flat([ [1,2,3], [ [4,5,6], [7,8,9], [[[[[10,11,12]]], [13,14,15]]] ], [[[[[[[[[[[16,17,18]]]]]]]]]]] ]);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
reduce
for of

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 124 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
reduce	135192.4 Ops/sec
for of	181552.7 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 benchmark and explain what's being tested.

**Benchmark Definition**

The benchmark is called "flatten reduce vs for .. of vs for" and it measures the performance of three different approaches to flatten an array with nested arrays:

1. **Reduce**: Using `Array.prototype.reduce()` method.
2. **For...of loop**: Using a traditional `for` loop with the `of` keyword to iterate over the array.
3. **Traditional `for` loop**: Using a classic `for` loop to iterate over the array.

**Options Compared**

The three options are compared for their performance, which is measured in executions per second.

**Pros and Cons of Each Approach**

1. **Reduce**:
	* Pros: concise and expressive code, eliminates the need to manually handle array indices.
	* Cons: can be slower than traditional loops due to the overhead of function calls and intermediate results.
2. **For...of loop**:
	* Pros: simple and easy to read, eliminates the need to manually handle array indices.
	* Cons: may not be as performant as traditional loops due to the overhead of iterating over arrays with `for...of`.
3. **Traditional `for` loop**:
	* Pros: can be highly optimized for performance, allows for manual control over iteration and indexing.
	* Cons: more verbose code, requires manual handling of array indices.

**Library and Special JS Features**

There are no libraries used in this benchmark, but the use of the `Array.prototype.reduce()` method is a built-in JavaScript feature. There are no special JS features or syntaxes being tested in this benchmark.

**Other Considerations**

The benchmark uses a test case that creates an array with multiple levels of nesting to simulate real-world scenarios where arrays need to be flattened. The performance results are reported for each approach, providing insight into which one is faster and more suitable for specific use cases.

**Alternative Approaches**

There are other approaches to flatten arrays in JavaScript, such as:

1. Using `Array.prototype.forEach()` with a callback function.
2. Using a recursive function to flatten the array.
3. Using a library like Lodash or Underscore.js to flatten arrays.

These alternatives may offer different trade-offs in terms of performance, readability, and maintainability compared to the three options tested in this benchmark.

Related benchmarks:

flatten reduce vs for .. of vs for (version: 0)

Comparing performance of: reduce vs for of

Created: 2 years ago by: Guest

Jump to the latest result

reduce

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