Benchmark: Reduce: Spread vs push

Script Preparation code:

var sut = [{ foo1: 'bar1' }, { foo2: 'bar2' }, { foo3: 'bar3' }];

Tests:

Spread
sut.reduce((acc, x) => [...acc, x], [])
Push
sut.reduce((acc, x) => { acc.push(x); return acc; }, [])

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Spread
Push

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Linux; arm_64; Android 13; Air1 Ultra+) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/132.0.6834.122 YaBrowser/25.2.4.122.00 SA/3 Mobile Safari/537.36

Browser/OS: Yandex Browser 25 on Android

View result in a separate tab

Test name	Executions per second
Spread	4410115.0 Ops/sec
Push	16585179.0 Ops/sec

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

LLMs can make mistakes. Check important info.

I'd be happy to help you understand the JavaScript microbenchmark on MeasureThat.net.

**Benchmark Overview**

The benchmark is designed to compare two approaches for reducing an array in JavaScript: using the spread operator (`[...acc, x]`) versus pushing elements onto the accumulator array manually (`acc.push(x)`).

**Benchmark Definition JSON**

The benchmark definition JSON provides the following information:

* **Name**: "Reduce: Spread vs push"
* **Description**: None
* **Script Preparation Code**: The script defines an object `sut` with three properties, which is used as the input for the reduction.
* **Html Preparation Code**: None (meaning no HTML preparation is required)

**Individual Test Cases**

There are two test cases:

1. **Spread**: The benchmark definition uses the spread operator (`[...acc, x]`) to create a new array and concatenate it with the accumulator `acc`. This approach is expected to be faster since it avoids the overhead of pushing elements onto an array.
2. **Push**: The second benchmark definition manually pushes each element onto the accumulator array using the `push()` method. This approach can lead to slower performance since it involves more operations on the array.

**Pros and Cons**

* **Spread Operator (Test Case 1)**:
	+ Pros: Efficiently creates a new array, avoids pushing elements onto an array.
	+ Cons: Requires JavaScript version support for the spread operator (`[...acc, x]`).
* **Push Operator (Test Case 2)**:
	+ Pros: Works in older JavaScript versions that don't support the spread operator.
	+ Cons: More operations are required on the array, potentially slower.

**Library and Purpose**

None of the test cases use any external libraries. The benchmark focuses solely on comparing two different reduction approaches.

**Special JS Feature/Syntax**

The `...` syntax used in the spread operator is a new feature introduced in ECMAScript 2015 (ES6). It allows for spreading an array or object into multiple arguments.

**Other Alternatives**

If you're interested in exploring other microbenchmarks, MeasureThat.net offers a wide range of tests covering various JavaScript-related topics. Some examples include:

* Benchmarks on array manipulation operations like `sort()`, `filter()`, and `map()`.
* Tests for string manipulation techniques like substring extraction and regular expression matching.
* Comparisons of performance between different JavaScript engines (e.g., V8, SpiderMonkey) and browsers.

Feel free to explore these alternatives if you're interested in learning more about JavaScript performance optimization!

Related benchmarks:

Reduce: Spread vs push (version: 0)

Comparing performance of: Spread vs Push

Created: 5 years ago by: Guest

Jump to the latest result

Spread

Push

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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