Benchmark: forEach vs reduce

Script Preparation code:

var a = Array.from({length:100},()=>Math.random());
var b = [];

Tests:

forEach
a.forEach(e=>{if (e>0.5) b.push(e)});
reduce
b = a.reduce((a,c)=>c>0.5?[...a,c]:a,[])

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
forEach
reduce

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 6 years ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:61.0) Gecko/20100101 Firefox/61.0

Browser/OS: Firefox 61 on Mac OS X 10.13

View result in a separate tab

Test name	Executions per second
forEach	763667.7 Ops/sec
reduce	40530.2 Ops/sec

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

LLMs can make mistakes. Check important info.

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

**Benchmark Overview**

The benchmark compares the performance of two common array methods in JavaScript: `forEach` and `reduce`. The test creates an array of 100 random numbers, then uses each method to filter out elements greater than 0.5.

**Options Compared**

Two options are compared:

1. **`forEach`**: Iterates over the array using a callback function, pushing elements that meet the condition into another array.
2. **`reduce`**: Reduces the array by applying a cumulative function to each element, filtering out those greater than 0.5.

**Pros and Cons**

* `forEach`:
	+ Pros: Simple, intuitive, and widely supported.
	+ Cons: May be less efficient due to the overhead of creating an intermediate array for filtering.
* `reduce`:
	+ Pros: More flexible and powerful than `forEach`, with a single pass over the array.
	+ Cons: Can be more complex to understand and use, especially for beginners.

**Library Used**

None in this benchmark. The code uses only built-in JavaScript features.

**Special JS Features or Syntax**

No special features or syntax are used in this benchmark. However, it's worth noting that some older browsers may not support `forEach` or `reduce`, which could affect the results.

**Benchmark Preparation Code**

The preparation code generates an array of 100 random numbers using `Array.from()` and initializes another empty array `b`.

**Individual Test Cases**

Two test cases are defined:

1. **`forEach`**: The first test case uses the `forEach` method to filter out elements greater than 0.5, pushing those that meet the condition into array `b`.
2. **`reduce`**: The second test case uses the `reduce` method to achieve the same filtering effect.

**Latest Benchmark Result**

The latest benchmark result shows two execution rates:

* `forEach`: approximately 763667 executions per second (Firefox 61 on a Mac).
* `reduce`: approximately 40530 executions per second (Firefox 61 on a Mac).

These results suggest that `forEach` is significantly faster than `reduce` in this specific test case.

**Other Alternatives**

If you're interested in exploring alternative approaches, here are some options:

1. **`filter()`**: Another array method that can be used for filtering. It's often faster and more efficient than `forEach`.
2. **`Array.prototype.map()`**: A method that creates a new array with transformed elements, which can also be used for filtering.
3. **Native WebAssembly (WASM) optimizations**: Some modern browsers support WASM optimizations for JavaScript engines like SpiderMonkey or V8.

Keep in mind that the choice of approach depends on your specific use case and performance requirements.

Related benchmarks:

forEach vs reduce (version: 0)

Comparing performance of: forEach vs reduce

Created: 6 years ago by: Guest

Jump to the latest result

forEach

reduce

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