Benchmark: Add new element to array: push vs destructuring

Tests:

spread operator
var params = [ "hello", true, 7 ] var other = [ ...params, 'new' ]
Push
var params = [ "hello", true, 7 ]; params.push('new');

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
spread operator
Push

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:146.0) Gecko/20100101 Firefox/146.0

Browser/OS: Firefox 146 on Ubuntu

View result in a separate tab

Test name	Executions per second
spread operator	10605792.0 Ops/sec
Push	77385928.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the benchmark.

**Benchmark Purpose:**
The goal of this benchmark is to compare the performance of two approaches for adding a new element to an array in JavaScript:

1. Using the `push()` method (e.g., `params.push('new')`)
2. Using the spread operator (e.g., `[...params, 'new']`)

**Options Compared:**

* **Push Method**: This is a traditional way of appending elements to an array by calling the `push()` method.
	+ Pros:
		- Well-established and widely supported syntax
		- Easy to read and write
	+ Cons:
		- May incur additional overhead due to function call
		- May not be as efficient as other methods for large arrays
* **Spread Operator**: This is a more modern way of spreading elements into an array using the spread operator (`...`).
	+ Pros:
		- More concise and expressive syntax
		- Can be faster than `push()` for large arrays
		- Allows for easier creation of new arrays with multiple sources
	+ Cons:
		- May require more effort to understand and implement correctly

**Other Considerations:**

* The benchmark also tests the performance of JavaScript engines across different browsers, devices, and operating systems.
* The test cases are designed to be simple and representative of common use cases.

**Library Used:**
None. This benchmark is pure JavaScript, without any external libraries or dependencies.

**Special JS Feature/Syntax:**
The spread operator (`...`) is a modern JavaScript feature introduced in ECMAScript 2015 (ES6). It allows for more concise and expressive array creation and manipulation.

**Benchmark Preparation Code:**
The provided JSON defines two test cases:

1. "spread operator" - This test case uses the spread operator to create a new array by spreading elements from `params` and appending `'new'`.
2. "Push" - This test case uses the traditional `push()` method to append `'new'` to the end of the `params` array.

**Benchmark Results:**
The latest benchmark results show that:

* The "Push" test case executed approximately 259,963,622 times per second on Chrome 129 on a Linux desktop.
* The "spread operator" test case executed approximately 35,613,676 times per second on the same configuration.

Overall, these results suggest that the spread operator may be faster than the traditional `push()` method for this specific benchmark, but it's essential to consider the specific use case and JavaScript engine being used.

Related benchmarks:

Add new element to array: push vs destructuring (version: 0)

Comparing performance of: spread operator vs Push

Created: 5 years ago by: Guest

Jump to the latest result

spread operator

Push

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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