Benchmark: Spread Operator vs Push Method

Tests:

Spread
const array = new Array(100) const value = "Addition" let newArray = [...array, value]
Push
const array = new Array(100) const value = "Addition" let newArray = array.push(value)

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: 29 days ago)

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

Browser/OS: Chrome 128 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Spread	5261800.5 Ops/sec
Push	11942829.0 Ops/sec

Autogenerated LLM Summary (model llama3.1:latest, generated 6 months ago):

LLMs can make mistakes. Check important info.

Let's break down the benchmark test case.

**Benchmark Name:** Spread Operator vs Push Method
**Description:** This test compares the performance of two methods to add an element to the end of an array: using the spread operator (`[...]`) and using the `push()` method.

**Test Cases:**

1. **Spread**
	* Code:
	```javascript
const array = new Array(100)
const value = "Addition"
let newArray = [...array, value]
```
	* This test uses the spread operator to create a new array by concatenating the original `array` with the `value`.
2. **Push**
	* Code:
	```javascript
const array = new Array(100)
const value = "Addition"
let newArray = array.push(value)
```
	* This test uses the `push()` method to add the `value` to the end of the `array`, and returns the new length of the array.

**Latest Benchmark Results:**

The test results show that, on average:

* **Push**: 1.25 million executions per second
* **Spread**: 7.20 million executions per second

**What's being tested:**

In this benchmark, we're testing how quickly each method can add an element to the end of a large array (100 elements). The results show that using the spread operator is significantly faster than using the `push()` method.

**Pros and Cons:**

* **Spread Operator:**
	+ Pros:
		- Faster execution time
		- Simple syntax
	+ Cons:
		- Creates a new array, which can be memory-intensive for large arrays
		- May not be suitable for use cases where the original array needs to remain unchanged
* **Push Method:**
	+ Pros:
		- Modifies the original array in place
		- Can be more efficient when working with very large arrays
	+ Cons:
		- Slower execution time compared to spread operator
		- May not be suitable for use cases where a new array is required

**Other Considerations:**

* When working with small arrays, the performance difference between `push()` and the spread operator may be negligible.
* If you need to add multiple elements to an array, using the spread operator can be more efficient than calling `push()` repeatedly.

**Library/Feature Used:**

None, this test uses only standard JavaScript features.

**Alternatives:**

Other ways to add an element to the end of an array include:

1. Using the `concat()` method:
	```javascript
let newArray = array.concat([value]);
```
2. Using a loop to push elements individually:
	```javascript
for (let i = 0; i < 100; i++) {
    array.push(value);
}
```
Note that these alternatives may have their own performance trade-offs and are not recommended as substitutes for the spread operator or `push()` method in most cases.

Related benchmarks:

Spread Operator vs Push Method (version: 0)

Comparing performance of: Spread vs Push

Created: 2 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.1:latest, generated 6 months ago):