Benchmark: flatMap vs reduce

Script Preparation code:

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

Tests:

reduce with concat
arr.reduce((acc, x) => [...acc, x, x], [])
flatMap
arr.flatMap(x => [x, x])

Historical Performance Data aggregated from 224 community runs

Desktop Results:

Chrome 169 runs

flatMap

3K/s

reduce with concat

15/s

Fastest: flatMap (237.3x faster)

View exact numbers

✓ flatMap: 3,453 ops/sec
• reduce with concat: 15 ops/sec

Firefox 30 runs

flatMap

4K/s

reduce with concat

1/s

Fastest: flatMap (2466.0x faster)

View exact numbers

✓ flatMap: 3,695 ops/sec
• reduce with concat: 1 ops/sec

Safari 8 runs

flatMap

12K/s

reduce with concat

7/s

Fastest: flatMap (1770.9x faster)

View exact numbers

✓ flatMap: 12,049 ops/sec
• reduce with concat: 7 ops/sec

Other 7 runs

flatMap

1K/s

reduce with concat

8/s

Fastest: flatMap (140.3x faster)

View exact numbers

✓ flatMap: 1,111 ops/sec
• reduce with concat: 8 ops/sec

Mobile Results:

Chrome 10 runs

flatMap

2K/s

reduce with concat

7/s

Fastest: flatMap (307.8x faster)

View exact numbers

✓ flatMap: 2,007 ops/sec
• reduce with concat: 7 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 concat
flatMap

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

Browser/OS: Chrome 138 on Mac OS X 10.15.7

View result in a separate tab

flatMap

5K/s

reduce with concat

21/s

View exact numbers

Test name	Executions per second
✓ flatMap	4,842 Ops/sec
reduce with concat	21 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks.

The provided JSON represents two individual test cases, `flatMap` and `reduce with concat`, which are designed to compare the performance of two approaches: using `flatMap` versus using `concat`.

**What is tested?**

In the context of these benchmarks, "tested" refers to measuring how efficiently the JavaScript engine can execute a specific piece of code.

Here's a brief overview of what each test case aims to measure:

1. **flatMap**: This test case measures the performance of the `flatMap` method on an array. The method is expected to flatten the array by concatenating arrays using the spread operator (`[...arr, ...x]`). What we want to know here is: How efficient is the JavaScript engine in flattening the array?
2. **reduce with concat**: This test case measures the performance of the `reduce` method on an array, but it uses the `concat` method to accumulate the results. The idea behind this test is to see how well the JavaScript engine handles concatenating arrays using `concat`, versus the more concise and modern `flatMap`.

**Options compared**

In these benchmarks, we have two main options:

1. **flatMap**: This option uses the `flatMap` method to flatten the array.
2. **reduce with concat**: This option uses the `reduce` method with the `concat` method to accumulate the results.

**Pros and Cons of each approach**

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

1. **flatMap**
	* Pros:
		+ More concise and readable code.
		+ Faster execution, as it avoids creating intermediate arrays.
	* Cons:
		+ Might be less intuitive for developers who are not familiar with this method.
2. **reduce with concat**
	* Pros:
		+ More traditional and widely used approach.
		+ Easier to understand for developers without experience with `flatMap`.
	* Cons:
		+ Creates intermediate arrays, which can lead to performance issues.

**Other considerations**

1. **Library usage**: Neither of these benchmarks uses any external libraries. However, it's worth noting that some modern JavaScript engines might optimize certain methods or algorithms more effectively than others.
2. **Special JS features or syntax**: This benchmark doesn't use any special JavaScript features or syntax beyond what's considered standard (ECMAScript 2020).

**Alternatives**

There are several alternatives to `flatMap` and `reduce with concat`, including:

1. Using other methods, such as `map` followed by a `flat()` call.
2. Implementing your own flattening logic using loops or recursive functions.
3. Using third-party libraries that provide optimized implementations of these methods.

However, for most use cases, the choices between `flatMap` and `reduce with concat` will depend on personal preference, code readability, and performance considerations specific to a particular project.

flatMap vs reduce (version: 0)

Comparing performance of: `reduce with concat vs flatMap`

Created: 5 years ago by: Guest

Go to the latest result

reduce with concat

flatMap

Historical Performance Data aggregated from 224 community runs

Desktop Results:

Chrome 169 runs

Firefox 30 runs

Safari 8 runs

Other 7 runs

Mobile Results:

Chrome 10 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 (version: 0)

Comparing performance of: reduce with concat vs flatMap

Created: 5 years ago by: Guest

Go to the latest result

reduce with concat

flatMap

Historical Performance Data aggregated from 224 community runs

Desktop Results:

Chrome 169 runs

Firefox 30 runs

Safari 8 runs

Other 7 runs

Mobile Results:

Chrome 10 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 concat vs flatMap`