Benchmark: Array.prototype.push vs spread operator vs flat

Tests:

Array.prototype.push
var params = [ "hello", true, 7 ]; var other = [ 1, 2 ].push(params);
spread operator
var params = [ "hello", true, 7 ] var other = [ 1, 2, ...params ]
Array.prototype.flat
var params = [ "hello", true, 7 ]; var other = [1, 2, params].flat()

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.prototype.push
spread operator
Array.prototype.flat

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/131.0.0.0 Safari/537.36 Edg/131.0.0.0

Browser/OS: Chrome 131 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Array.prototype.push	77431872.0 Ops/sec
spread operator	60918044.0 Ops/sec
Array.prototype.flat	10146875.0 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 and its components.

**Benchmark Definition**

The benchmark is designed to compare three different approaches for adding elements to an array:

1. `Array.prototype.push()`
2. The new ES6 spread operator (`...`)
3. `Array.prototype.flat()` (note that this method flattens an array of arrays, not just adds elements)

**Options Compared**

The benchmark compares the performance of these three approaches on a sample dataset. The dataset consists of an array with 3 elements: a string, a boolean, and a number.

**Pros and Cons**

1. **`Array.prototype.push()`**: This is the traditional method for adding elements to an array in JavaScript. It's straightforward but can be inefficient if used incorrectly (e.g., when dealing with large arrays).
2. **Spread Operator (`...`)**: The spread operator provides a concise way to add elements to an array. However, it may not be as efficient as `push()` when dealing with very large arrays, since it creates a new array instance.
3. **`Array.prototype.flat()`**: This method flattens an array of arrays into a single array. While it can be used to add elements to an array (by passing the elements as an argument), its primary purpose is not addition.

**Library and Special JS Features**

The benchmark does not use any specific libraries or frameworks, but it relies on JavaScript's built-in `Array` prototype methods (`push()` and `flat()`).

There are no special JavaScript features used in this benchmark (e.g., async/await, generators, closures).

**Other Alternatives**

If you want to add elements to an array, other alternatives might include:

* Using `concat()` instead of `push()`: While `concat()` is also part of the Array prototype, it creates a new array instance and may be less efficient than `push()`.
* Using a library like Lodash's `insertAt()` function: This function provides a more concise way to add elements to an array, but it relies on a external library.
* Using a custom implementation: Depending on your specific requirements, you might consider implementing your own addition method using JavaScript.

**Benchmark Result**

The latest benchmark result shows the execution counts per second for each test case:

| TestName | ExecutionsPerSecond |
| --- | --- |
| `Array.prototype.push()` | 47762372.0 |
| Spread Operator (`...`) | 44929016.0 |
| `Array.prototype.flat()` | 5202483.5 |

The results suggest that the spread operator is slightly faster than `push()`, while `flat()` is the slowest of the three.

Keep in mind that benchmarking results can vary depending on your specific use case, system configuration, and JavaScript engine version.

Related benchmarks:

Array.prototype.push vs spread operator vs flat (version: 0)

Compare the new ES6 spread operator with the traditional concat() method

Comparing performance of: Array.prototype.push vs spread operator vs Array.prototype.flat

Created: 5 years ago by: Guest

Jump to the latest result

Array.prototype.push

spread operator

Array.prototype.flat

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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