Benchmark: reduce vs map + filter

Script Preparation code:

var arr = (() => {
  const res = new Array(10000).fill({id: 0});
  res[9000] = {id: 1};
  return res;
})();

Tests:

reduce
arr.reduce((acc,x) => { if (x.id > 0) { acc.push(x.id) } return acc; },[])
map + filter
arr.map(x => x.id).filter(x => x > 0)

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: 3 years ago)

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

Browser/OS: Chrome 91 on Windows

View result in a separate tab

Test name	Executions per second
reduce	24343.6 Ops/sec
map + filter	5542.7 Ops/sec

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

LLMs can make mistakes. Check important info.

**Benchmark Overview**

The provided JSON represents a JavaScript microbenchmark that compares the performance of two approaches: `reduce` and `map` + `filter`. The benchmark measures the execution time of these two approaches on a sample array with 10,000 elements.

**Test Cases**

There are two individual test cases:

1. **Reduce**: This test case uses the `reduce` method to iterate over the array and push the `id` property to an accumulator array when `x.id > 0`. The `reduce` method is a built-in JavaScript array method that applies a callback function to each element in the array, accumulating a value.
2. **Map + Filter**: This test case uses the `map` method to create a new array with only the elements where `x.id > 0`, and then uses the `filter` method to further filter out any null values. The resulting array is then iterated over.

**Options Compared**

The two approaches are compared in terms of their performance, with the goal of determining which one is faster for this specific use case.

**Pros and Cons of Each Approach**

1. **Reduce**:
	* Pros:
		+ Can be more efficient because it only iterates over the array once.
		+ Does not create a new array, which can reduce memory usage.
	* Cons:
		+ Can be less readable due to its concise syntax, making it harder for developers to understand what's happening inside the callback function.
2. **Map + Filter**:
	* Pros:
		+ More readable because each step is done explicitly and clearly.
		+ Allows for more flexibility in terms of post-processing the resulting array.
	* Cons:
		+ Requires two separate operations, which can increase overhead due to creating temporary arrays.

**Library Used**

None. This benchmark does not use any external libraries.

**Special JS Feature or Syntax**

The benchmark uses a feature called **Arrow Functions**, which are concise ways of defining small functions that don't need the `function` keyword. Arrow functions are used in both test cases for their brevity and readability.

**Other Alternatives**

Other approaches could be explored, such as:

* Using `forEach`
* Using `every` or `some` instead of `filter`
* Using a custom loop instead of either `map`/`reduce`

However, these alternatives might change the nature of the benchmark significantly and may not provide comparable results.

**Benchmark Preparation Code**

The script preparation code generates an array with 10,000 elements, where only the 9th element has an `id` property greater than 0. This is done to ensure that the test case doesn't spend too much time searching for elements to process.

**Other Considerations**

* The benchmark measures execution times in milliseconds per second.
* The device platform and operating system are specified to ensure consistent results across different environments.
* Each test case runs multiple executions to provide an average execution time.

Related benchmarks:

reduce vs map + filter (version: 0)

Comparing performance of: reduce vs map + filter

Created: 3 years 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):