Benchmark: Array concat vs spread operator vs push vs push.apply

Tests:

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

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.prototype.concat
spread operator
Push
Push.apply

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

**What is tested on the provided JSON?**

The provided JSON represents a JavaScript benchmarking test case that compares the performance of four different methods for concatenating arrays in JavaScript:

1. `Array.prototype.concat()`
2. The spread operator (`...`)
3. `push()` with multiple arguments
4. `push.apply()` with an array as an argument

These methods are compared to determine which one is the most efficient.

**Options compared**

The benchmark compares the performance of these four methods on the following arrays:

* `[ "hello", true, 7 ]`
* `[ 1, 2, ...params ]`

where `params` is the first array with three elements: `"hello"`, `true`, and `7`.

**Pros and Cons of each approach**

Here's a brief overview of each method:

1. **Array.prototype.concat()**
	* Pros: Widely supported and well-established method.
	* Cons: Can be slower due to the overhead of calling a method on an array prototype.
2. **Spread operator (`...`)**
	* Pros: Fast and concise way to create new arrays.
	* Cons: Only works in modern JavaScript environments (ES6+).
3. **Push() with multiple arguments**
	* Pros: Can be more efficient than `concat()` if you need to add only a few elements.
	* Cons: Can be slower for larger arrays, and the behavior can be surprising if not used carefully.
4. **Push.apply() with an array as an argument**
	* Pros: Similar to `push()` but allows for more flexibility in passing arguments.
	* Cons: Can be slower due to the overhead of calling a method on an object prototype.

**Library usage**

There is no explicit library usage in this benchmark, but it does use the `Array.prototype` and `Object.prototype` methods as part of the JavaScript language standard.

**Special JS features or syntax**

The benchmark uses the spread operator (`...`) which was introduced in ECMAScript 2015 (ES6). It also assumes that the test environment is running a modern JavaScript engine.

**Other alternatives**

If you need to concatenate arrays, other alternatives include:

* Using `Array.prototype.push()` multiple times: `array.push(...item1); array.push(...item2);`
* Using a loop to iterate over the elements to be concatenated
* Using a library like Lodash or Underscore.js for more complex array operations

However, these alternatives may not provide the same level of performance and conciseness as the methods compared in this benchmark.

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:109.0) Gecko/20100101 Firefox/118.0

Browser/OS: Firefox 118 on Windows

View result in a separate tab

Test name	Executions per second
Array.prototype.concat	28801384.0 Ops/sec
spread operator	25460766.0 Ops/sec
Push	35445700.0 Ops/sec
Push.apply	23840442.0 Ops/sec

Related benchmarks:

Array concat vs spread operator vs push vs push.apply (version: 0)

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

Comparing performance of: Array.prototype.concat vs spread operator vs Push vs Push.apply

Created: one year ago by: Guest

Jump to the latest result

Array.prototype.concat

spread operator

Push

Push.apply

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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