Benchmark: Reduce vs map with empty filter

Script Preparation code:

var arr = ['a', 'b', 'c'];

Tests:

reduce
arr.reduce((curr, acc) => { if(curr === 'a') return [...curr, acc]; return curr }, [])
map+filter
arr.map(curr => curr === 'a' ? curr : undefined).filter(Boolean)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
reduce
map+filter

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/129.0.0.0 Safari/537.36

Browser/OS: Chrome 129 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
reduce	26005992.0 Ops/sec
map+filter	3810817.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested.

**Benchmark Definition**

The benchmark is testing two approaches to achieve the same result: reducing an array of strings using either `reduce()` or mapping the array, filtering out non-matching elements, and then filtering out falsy values (`undefined` in this case).

**Options Compared**

1. **Reduce**: The `reduce()` method applies a callback function to each element in the array, accumulating a result. In this case, the callback function checks if the current element is 'a'. If it is, it returns a new array with the current element and the accumulated result (initially an empty array). If not, it returns the original accumulated result. The `filter(Boolean)` step removes any falsy values from the resulting array.
2. **Map + Filter**: This approach uses the `map()` method to transform each element in the array into a boolean value (`true` if 'a' matches and `false` otherwise), then filters out non-boolean values using `filter(Boolean)`. The final result is an array of only the elements that passed the filter.

**Pros and Cons**

1. **Reduce**:
	* Pros: Can be more efficient for small arrays since it avoids creating a new intermediate array.
	* Cons: Requires iterating over the entire array multiple times (once for filtering out falsy values).
2. **Map + Filter**:
	* Pros: More concise and potentially faster since it only iterates over the original array once.
	* Cons: May be less efficient for large arrays due to the overhead of creating a new boolean array.

**Library and Special JS Features**

Neither `reduce()` nor `map() + filter()` rely on any specific libraries. However, these methods are built-in to JavaScript and are used extensively in web development.

**Other Considerations**

* The benchmark assumes that the input array contains only strings ('a' or something else).
* If the input array is very large, the `reduce()` approach might be more efficient due to its reduced number of iterations.
* However, if the input array is small and relatively simple, the `map() + filter()` approach might be faster due to its concise nature.

**Alternatives**

If you were to rewrite this benchmark using alternative approaches, here are a few options:

1. **forEach**: Instead of using `reduce()` or `map()`, you could use the `forEach` method to iterate over the array and accumulate the results.
2. **Looping with indices**: You could write a loop that iterates over the array and manually applies the filtering and transformation steps.
3. **Using a different data structure**: Depending on the specific requirements, you might consider using a different data structure (e.g., a Set or a Map) to achieve the desired result.

Keep in mind that these alternative approaches would likely be less efficient than the original `reduce()` and `map() + filter()` methods.

Related benchmarks:

Reduce vs map with empty filter (version: 0)

Comparing performance of: reduce vs map+filter

Created: one year ago by: Guest

Jump to the latest result

reduce

map+filter

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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