Benchmark: flatMap or concat

Tests:

concat
const arr = Array.from({ length: 10000 }).map((x,i) => i ) const testResult = [arr,arr]; return testResult[0].concat(testResult[1])
flatMap
const arr = Array.from({ length: 10000 }).map((x,i) => i ) const testResult = [arr,arr]; return testResult.flatMap(x => x)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
concat
flatMap

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

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

Browser/OS: Chrome 116 on Windows

View result in a separate tab

Test name	Executions per second
concat	3972.7 Ops/sec
flatMap	683.5 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net!

**What is being tested?**

The provided JSON represents two benchmark tests: `concat` and `flatMap`. The test cases are designed to measure the performance difference between using `Array.prototype.concat()` and `Array.prototype.flatMap()` methods.

**Options compared:**

In this benchmark, we have two options:

1. **Concatenation (`concat`)**: This method creates a new array by concatenating multiple arrays.
2. **Flattening with map (`flatMap`)**: This method applies a mapping function to each element of an array and returns a new array with the results.

**Pros and Cons of each approach:**

1. **Concatenation (`concat`)**:
	* Pros:
		+ Easy to understand and implement.
		+ Works well for small arrays or when working with primitive types.
	* Cons:
		+ Creates a new array, which can be memory-intensive for large datasets.
		+ Can lead to slower performance due to the overhead of creating a new array.
2. **Flattening with map (`flatMap`)**:
	* Pros:
		+ More concise and expressive than concatenation.
		+ Reduces memory allocation and copying, resulting in better performance.
	* Cons:
		+ May be less intuitive for developers who are not familiar with the method.

**Library:**

In this benchmark, no external library is used. The `Array.prototype.concat()` and `Array.prototype.flatMap()` methods are built-in JavaScript methods that operate on arrays.

**Special JS features or syntax:**

There are no special JS features or syntax used in this benchmark. The test cases only utilize standard JavaScript syntax for creating arrays and using the `concat` and `flatMap` methods.

**Other alternatives:**

If you need to flatten an array, there is another alternative method available:

* Using `Array.prototype.reduce()` and a callback function to concatenate elements:
```javascript
arr.reduce((acc, x) => acc.concat(x), []);
```
While this approach can be effective, it may have similar performance characteristics to `flatMap()`.

**Benchmark preparation code:**

The provided JSON doesn't include any script preparation code. The actual benchmark tests are defined in the "Benchmark Definition" section of each test case.

**Latest benchmark result:**

The latest benchmark result shows that Chrome 116 on a desktop platform has an average executions per second (EPS) value of:

* `concat`: approximately 3972.6953125 EPS
* `flatMap`: approximately 683.5086059570312 EPS

This indicates that, for this specific test case and configuration, `flatMap()` outperforms `concat()` by a significant margin.

Keep in mind that benchmark results may vary depending on the system configuration, hardware, and other factors not captured in this example.

Related benchmarks:

flatMap or concat (version: 0)

Comparing performance of: concat vs flatMap

Created: one year ago by: Guest

Jump to the latest result

concat

flatMap

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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