Benchmark: reduce() vs map().filter() vs flatMap() -asadf

Script Preparation code:

var arr = [];
var i = 0;

while (i <= 30) arr[i] = i++;

Tests:

map().filter()
arr.map(x => x/100).filter(x => x % 3)
reduce()
arr.reduce((acc, x) => { if (x % 3) acc.push(x/100); return acc; }, [])
flatMap
arr.flatMap(x => x % 3 ? x/100 : [])

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
map().filter()
reduce()
flatMap

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark definition and explanation for each test case.

**Benchmark Definition:**
MeasureThat.net is testing the performance of three different approaches to flatten an array: `reduce()`, `map().filter()`, and `flatMap()`.

**Script Preparation Code:**
The script preparation code creates a large array `arr` with 31 elements, using a simple loop that assigns each element's index to the array.

**Html Preparation Code:**
There is no HTML preparation code provided, which suggests that the benchmarking focuses solely on JavaScript performance.

**Individual Test Cases:**

1. **map().filter()**
	* The benchmark definition uses `map()` to create a new array with the elements' indices divided by 100, and then applies `filter()` to keep only the elements whose index modulo 3 is not zero.
	* This approach creates two intermediate arrays: one with the transformed elements and another with the filtered elements.
	* Pros:
		+ Easy to understand and implement.
		+ Does not require a library or special syntax.
	* Cons:
		+ Creates multiple intermediate arrays, which can lead to performance issues due to array copying.
2. **reduce()**
	* The benchmark definition uses `reduce()` to accumulate an array of elements whose index modulo 3 is not zero, by pushing each element to the accumulator and returning it unchanged.
	* This approach creates a single array with the desired elements without intermediate steps.
	* Pros:
		+ Only creates one array, which reduces memory allocation and copying overhead.
	* Cons:
		+ Requires understanding of the `reduce()` method and its callback function.
3. **flatMap()**
	* The benchmark definition uses `flatMap()` to flatten the original array into a new array with the desired elements.
	* This approach is similar to `map().filter()` but eliminates the need for an intermediate array by returning a flat array of arrays.
	* Pros:
		+ Efficient use of memory and copying overhead, as it returns a single array directly.
	* Cons:
		+ Requires understanding of the `flatMap()` method and its callback function.

**Library Usage:**
None of these test cases require any external libraries, making them suitable for standalone JavaScript execution.

**Special JS Features/Syntax:**
None of these benchmarking approaches rely on special JavaScript features or syntax beyond the standard `map()`, `reduce()`, and `filter()` methods. However, it's worth noting that modern browsers may have additional optimizations for `flatMap()` due to its more efficient implementation compared to `map().filter()`.

**Alternatives:**
For a similar benchmarking approach, you could consider testing other array flattening methods or variations on the given approaches, such as:

* Using `forEach()` instead of `map()`
* Utilizing `Array.prototype.flat()` (if supported by the target browsers)
* Implementing your own loop-based flattening solution

Keep in mind that browser support and performance may vary depending on the chosen alternatives.

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

Browser/OS: Chrome 119 on Windows

View result in a separate tab

Test name	Executions per second
map().filter()	2477422.8 Ops/sec
reduce()	10652423.0 Ops/sec
flatMap	870113.2 Ops/sec

Related benchmarks:

reduce() vs map().filter() vs flatMap() -asadf (version: 2)

reduce vs map.filter vs flatMap

Comparing performance of: map().filter() vs reduce() vs flatMap

Created: one year ago by: Registered User

Jump to the latest result

map().filter()

reduce()

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