Benchmark: Reduce with spread operator vs without on a large array

Script Preparation code:

var array = new Array(10000).fill(1)

function withSpread(acc, item, index) {
    return {
        ...acc,
        [index]: {
            id: index,
            timestamp: new Date(new Date().getTime() + (index * 1000)),
            isOdd: index % 2 === 0,
            isEven: index % 2 !== 0
        }
    };
}

function withOutSpread(acc, item, index) {
    acc[index] = {
        id: index,
        timestamp: new Date(new Date().getTime() + (index * 1000)),
        isOdd: index % 2 === 0,
        isEven: index % 2 !== 0
    }
    return acc;
}

Tests:

reduce with spread
array.reduce(withSpread, {})
reduce without spread
array.reduce(withOutSpread, {})

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
reduce with spread
reduce without spread

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 122 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
reduce with spread	107.8 Ops/sec
reduce without spread	563.6 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark definition and explain what is tested, along with the pros and cons of different approaches.

**Benchmark Definition**

The benchmark measures the performance of JavaScript's `Array.prototype.reduce()` method using two different implementations: one that uses the spread operator (`withSpread`) and another that doesn't (`withOutSpread`).

**What is being tested?**

The test case compares the execution times of the `reduce()` method with these two implementations on a large array (10,000 elements) containing numbers. The benchmark also checks how the performance differs between using the spread operator and not using it.

**Options compared:**

* **With Spread Operator (`withSpread`)**:
	+ Uses the spread operator (`...`) to create a new object that accumulates the values of the array.
	+ Creates a new object with each iteration, which can lead to more memory allocations and potentially slower performance due to object creation.
	+ May have better cache locality due to the use of objects, which can improve performance for certain workloads.
* **Without Spread Operator (`withOutSpread`)**:
	+ Modifies the accumulator object directly, without creating a new one on each iteration.
	+ Can lead to slower performance due to the overhead of modifying existing objects and potential memory allocation issues.
	+ May have better cache locality due to the use of modified objects, which can improve performance for certain workloads.

**Pros and Cons:**

* **With Spread Operator (`withSpread`)**:
	+ Pros:
		- Better cache locality
		- Can lead to more predictable behavior due to object creation
	+ Cons:
		- More memory allocations on each iteration
		- Potential slower performance due to object creation overhead
* **Without Spread Operator (`withOutSpread`)**:
	+ Pros:
		- Can be faster due to reduced object creation overhead
		- May have better cache locality
	+ Cons:
		- More complex code due to direct object modification
		- Potential slower performance due to modifying existing objects

**Library and Special JS Feature:**

* The benchmark uses the `Array.prototype.reduce()` method, which is a built-in JavaScript function.
* No special JavaScript features or syntax are used in this benchmark.

**Alternative Approaches:**

* Other approaches that could be compared include:
	+ Using `forEach()` instead of `reduce()`
	+ Implementing a custom reduction algorithm using a loop
	+ Using a different data structure, such as a linked list, to reduce the array

Keep in mind that the results of this benchmark may vary depending on the specific use case and requirements. It's always a good idea to consider multiple approaches and microbenchmarks to ensure the best performance for your specific application.

Related benchmarks:

Reduce with spread operator vs without on a large array (version: 0)

Reduce with spread operator vs without on a large array

Comparing performance of: reduce with spread vs reduce without spread

Created: 2 years ago by: Guest

Jump to the latest result

reduce with spread

reduce without spread

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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