Benchmark: flatMap + flatMap vs flat(2)+map

Script Preparation code:

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

Tests:

flatmap
arr.flatMap((x) => [[1, 2], [1, 2]].flatMap(y => [x, y]))
map+flat
arr.map((x) => [[1, 2], [1, 2]].map(y => [x, y])).flat(2)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
flatmap
map+flat

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

Browser/OS: Chrome 123 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
flatmap	566.3 Ops/sec
map+flat	1327.6 Ops/sec

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

LLMs can make mistakes. Check important info.

I'd be happy to help explain the provided benchmark.

**Benchmark Overview**

The benchmark measures the performance difference between two approaches:

1. `flatMap` with an arrow function
2. `map` followed by `flat(2)` with an arrow function

**Script Preparation Code**

The script preparation code is:
```javascript
var arr = Array(10,000).fill(0);
```
This creates an array of 10,000 zeros.

**Html Preparation Code**

There is no html preparation code provided.

**Library Usage**

In the benchmark, we can see that it uses the `Array.prototype.flatMap()` and `Array.prototype.map()` methods. These methods are part of the ECMAScript standard and do not require any additional libraries to be included.

However, in some browsers, `flat(2)` is not supported by default. In this case, it's possible that a polyfill or transpiler was used to make `flat` work.

**Special JavaScript Features/Syntax**

There are no special JavaScript features or syntaxes being tested in this benchmark.

**Benchmark Test Cases**

The test cases compare the performance of two approaches:

1. `flatMap`: Using `flatMap()` with an arrow function to flatten an array of arrays.
```javascript
arr.flatMap((x) => [[1, 2], [1, 2]].flatMap(y => [x, y]));
```
2. `map + flat(2)`: Using `map()` followed by `flat(2)` with an arrow function to flatten an array of arrays.
```javascript
arr.map((x) => [[1, 2], [1, 2]].map(y => [x, y])).flat(2);
```
**Benchmark Results**

The benchmark results show the performance of each approach on a Chrome browser:

* `map + flat`: 1327.55 executions per second
* `flatMap`: 566.32 executions per second

**Other Alternatives**

If the `flatMap` method was not supported by the browser, alternative approaches could have been used, such as:

1. Using a custom implementation of `flatMap` using `map()` and `concat()`.
2. Using a library that provides a polyfill for `flat(2)`, such as Lodash or Underscore.js.

However, in this case, the `Array.prototype.flatMap()` method is used, which is a built-in feature of JavaScript and does not require any additional libraries to be included.

Related benchmarks:

flatMap + flatMap vs flat(2)+map (version: 0)

Comparing performance of: flatmap vs map+flat

Created: 2 years ago by: Guest

Jump to the latest result

flatmap

map+flat

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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