Benchmark: flatMap vs reduce with spread vs reduce with push

Script Preparation code:

var arr = Array(10_000).fill(0)

Tests:

reduce with spread
arr.reduce((acc, x) => [...acc, x], [])
flatMap
arr.flatMap(x => [x])
reduce with push
arr.reduce((acc, x) => { acc.push(x); return acc; }, [])

Historical Performance Data aggregated from 5 community runs

Desktop Results:

Chrome 5 runs

reduce with push

31K/s

flatMap

5K/s

reduce with spread

27/s

Fastest: reduce with push (1142.7x faster)

View exact numbers

✓ reduce with push: 31,017 ops/sec
• flatMap: 5,174 ops/sec
• reduce with spread: 27 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
reduce with spread
flatMap
reduce with push

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 139 on Windows

View result in a separate tab

reduce with push

15K/s

flatMap

2K/s

reduce with spread

12/s

View exact numbers

Test name	Executions per second
✓ reduce with push	14,786 Ops/sec
flatMap	2,244 Ops/sec
reduce with spread	12 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 JavaScript benchmark test case on the MeasureThat.net website. Let's break it down and analyze each part.

**Benchmark Definition**

The benchmark definition is a code snippet that defines a JavaScript function. There are three different functions being tested:

1. `arr.reduce((acc, x) => [...acc, x], [])`: This is the "reduce with spread" option. The `reduce` method applies a function to each element in an array and reduces it to a single value. In this case, it's using the spread operator (`...`) to create a new array.
2. `arr.flatMap(x => [x])`: This is the "flatMap" option. The `flatMap` method returns a new array with the results of applying a function on every element in an array.
3. `arr.reduce((acc, x) => {\r\n\tacc.push(x);\r\n  \treturn acc;\r\n}, [])`: This is the "reduce with push" option. It's similar to the first option but uses the `push` method to add elements to an array instead of using the spread operator.

**Options Compared**

The three options being compared are:

* Reduce with spread: Uses the spread operator (`...`) to create a new array.
* Flatten (flatMap): Returns a new array with the results of applying a function on every element in an array.
* Reduce with push: Uses the `push` method to add elements to an array.

**Pros and Cons**

Here's a brief summary of the pros and cons of each approach:

1. **Reduce with spread**: Pros:
	* Efficient use of memory, as it creates a new array instead of modifying the original.
	* Easy to implement and understand.
Cons:
	* May have performance overhead due to the creation of a new array.
2. **flatMap**: Pros:
	* Can be more efficient than `reduce` in some cases, as it avoids creating an intermediate array.
	* Simple to implement.
Cons:
	* May not work well with arrays that need to be modified (e.g., adding elements), as it returns a new array instead of modifying the original.
3. **Reduce with push**: Pros:
	* Suitable for arrays that need to be modified, as it uses the `push` method.
Cons:
	* More complex implementation than the first two options, as it requires manually managing the array's length and elements.

**Other Considerations**

When choosing between these options, consider the following:

* Memory usage: If memory efficiency is crucial, reduce with spread might be a better choice. However, if performance is more important, flatMap or reduce with push might be more suitable.
* Array modification: If you need to modify an array in-place, reduce with push is likely the best option.

**Library Usage**

There is no explicit library usage in this benchmark. The `reduce` and `flatMap` methods are built-in JavaScript methods, and the `push` method is part of the Array prototype.

**Special JS Features or Syntax**

No special JavaScript features or syntax are being tested in this benchmark.

flatMap vs reduce with spread vs reduce with push (version: 0)

Comparing performance of: `reduce with spread vs flatMap vs reduce with push`

Created: 2 years ago by: Guest

Go to the latest result

reduce with spread

flatMap

reduce with push

Historical Performance Data aggregated from 5 community runs

Desktop Results:

Chrome 5 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

flatMap vs reduce with spread vs reduce with push (version: 0)

Comparing performance of: reduce with spread vs flatMap vs reduce with push

Created: 2 years ago by: Guest

Go to the latest result

reduce with spread

flatMap

reduce with push

Historical Performance Data aggregated from 5 community runs

Desktop Results:

Chrome 5 runs

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: `reduce with spread vs flatMap vs reduce with push`