Benchmark: forEach vs reduce vs for - fill object spread

Script Preparation code:

var arr = [];
for (var i = 0; i < 50000; i++) {
  arr.push(i);
}

Tests:

map then forEach with spread
var objSpread = {}; var mapped = arr.map(item => ({ [item]: { exists: true }})); mapped.forEach(item => { objSpread = { ...objSpread, ...item }; });
reduce spread
var objReduce = arr.reduce((acc, item) => { var temp = { [item]: { exists: true } }; return {...acc, ...temp }; }, {});
map then forEach with assign
var objAssign = {}; var mapped = arr.map(item => ({ [item]: { exists: true }})); mapped.forEach(item => { var key = Object.keys(item)[0]; objAssign[key] = item[key] });
reduce assign
var objReduce = arr.reduce((acc, item) => { var temp = { [item]: { exists: true } }; var key = Object.keys(temp)[0]; acc[key] = temp[key]; return acc; }, {});

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
map then forEach with spread
reduce spread
map then forEach with assign
reduce assign

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 117 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
map then forEach with spread	1.4 Ops/sec
reduce spread	1.5 Ops/sec
map then forEach with assign	65.2 Ops/sec
reduce assign	75.8 Ops/sec

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

LLMs can make mistakes. Check important info.

**Benchmark Overview**

The provided JSON represents a JavaScript microbenchmarking test suite, where users can compare the performance of different approaches to achieve the same result.

**Benchmark Definition**

The benchmark definition is as follows:

* Create an empty object `objSpread` and `objAssign`.
* Generate an array `arr` with 50,000 elements using a for loop.
* Use various methods (map, reduce, or assign) to populate the objects `objSpread` and/or `objAssign` with data from the `arr`.

**Test Cases**

There are four test cases:

1. **Map then ForEach with Spread**: Use the map function to generate an array of objects with a single property, and then use the forEach function to spread the properties into the `objSpread` object.
2. **Reduce Spread**: Use the reduce function to generate an object with a single property, and then spread the result into the `objReduce` object.
3. **Map then ForEach with Assign**: Use the map function to generate an array of objects with a single property, and then use the forEach function to assign the properties from the first object in each array to `objAssign`.
4. **Reduce Assign**: Use the reduce function to generate an object with a single property, and then assign the result directly to `objReduce`.

**Library Usage**

None of the test cases explicitly use any external libraries.

**Special JS Features/Syntax**

The benchmark uses some special JavaScript features:

* **Destructuring Assignment (Spread Operator)**: Used in the map and reduce functions to extract properties from objects.
* **Arrow Functions**: Used as lambda functions in the map function.
* **Object Keys Extraction**: Used in the reduce function to extract the first property key from an object.

**Pros and Cons of Different Approaches**

Here's a brief summary of the pros and cons of each approach:

1. **Map then ForEach with Spread**:
	* Pros: Easy to understand, straightforward implementation.
	* Cons: May lead to unnecessary object allocations, as the `objSpread` object is recreated on each iteration.
2. **Reduce Spread**:
	* Pros: Efficient use of reduce function, potentially reduces memory allocations.
	* Cons: More complex implementation, may be harder to read and understand for beginners.
3. **Map then ForEach with Assign**:
	* Pros: Easy to implement, no unnecessary object allocations.
	* Cons: May lead to performance issues if the `objAssign` object is large, as it requires multiple assignments.
4. **Reduce Assign**:
	* Pros: Efficient use of reduce function, potentially reduces memory allocations.
	* Cons: More complex implementation, may be harder to read and understand for beginners.

**Other Alternatives**

There are other approaches that could be used to solve this problem:

1. Using the `Array.prototype.forEach` method directly on the `arr` array, without creating intermediate objects.
2. Using a custom loop function instead of map or reduce.
3. Using a different data structure, such as a single object with nested properties, to avoid unnecessary object allocations.

Note that these alternatives may not be considered "standard" JavaScript approaches and may require more significant changes to the implementation.

Related benchmarks:

forEach vs reduce vs for - fill object spread (version: 0)

Comparing performance of: map then forEach with spread vs reduce spread vs map then forEach with assign vs reduce assign

Created: 4 years ago by: Guest

Jump to the latest result

map then forEach with spread

reduce spread

map then forEach with assign

reduce assign

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