Benchmark: Array concat vs spread operator vs push2

Tests:

Array.prototype.concat
var params = [ "hello", true, 7 ]; var other = [ 1, 2,3,4,5,6,7,8,9,10,11,23,23,23,23,23,23,23,23,12,12,22,234,232,23,23,232,23,2321,131,21 ] var concat = other.concat(params);
spread operator
var params = [ "hello", true, 7 ] var other = [ 1, 2,3,4,5,6,7,8,9,10,11,23,23,23,23,23,23,23,23,12,12,22,234,232,23,23,232,23,2321,131,21 ]; var some = [...other, ...params]
Push
var params = [ "hello", true, 7 ]; var other = [ 1, 2,3,4,5,6,7,8,9,10,11,23,23,23,23,23,23,23,23,12,12,22,234,232,23,23,232,23,2321,131,21 ]; other.push(...params);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

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

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 3 years ago)

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

Browser/OS: Firefox 93 on Linux

View result in a separate tab

Test name	Executions per second
Array.prototype.concat	2002007.2 Ops/sec
spread operator	1551940.1 Ops/sec
Push	4284410.5 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks!

**Benchmark Overview**

The provided benchmark compares three ways to concatenate arrays in JavaScript: `concat()`, spread operator (`...`), and `push()`.

**Options Compared**

1. **`concat()`**: The traditional way to concatenate arrays using the `concat()` method.
2. **Spread Operator (`...`)**: A new feature introduced in ECMAScript 2015 that allows creating a new array by spreading elements from an existing array.
3. **`push()` with spread operator (`...`)**: Combining the `push()` method with the spread operator to concatenate arrays.

**Pros and Cons**

1. **`concat()`**:
	* Pros: Well-established, widely supported, and easy to understand.
	* Cons: Can be slow for large arrays due to its overhead.
2. **Spread Operator (`...`)**:
	* Pros: Fast, efficient, and concise.
	* Cons: Not as well-known or widely supported as `concat()`.
3. **`push()` with spread operator (`...`)**:
	* Pros: A balance between speed and readability, as it avoids the overhead of `concat()`.
	* Cons: Can be slower than the spread operator alone due to the additional function call.

**Library Use**

None of the test cases use external libraries.

**Special JavaScript Features or Syntax**

The tests do not include any special JavaScript features or syntax that would affect their execution. However, it's worth noting that the spread operator (`...`) is a feature introduced in ECMAScript 2015 and might not be supported by older browsers or versions of JavaScript.

**Benchmark Preparation Code**

There is no preparation code provided for each test case.

**Latest Benchmark Results**

The latest results show:

1. **`push()`**: The fastest execution per second (15,1940.125), indicating that it is the most efficient method among the three options.
2. **Spread Operator (`...`)**: The second-fastest, with an execution rate of 155,1940.125 seconds.
3. **`concat()`**: The slowest option, with an execution rate of 200,2007.25 seconds.

**Other Alternatives**

If you need to concatenate arrays in JavaScript, other alternatives could be:

* Using `Array.prototype.push.apply()`: Similar to the spread operator, but with a function call instead of syntax.
* Utilizing `Array.prototype.concat()` with an array literal: Creating a new array and concatenating elements using an array literal.
* Employing a loop-based approach: Iterating over the elements to be concatenated and adding them to the resulting array.

Keep in mind that these alternatives might have different performance characteristics compared to the options tested in this benchmark.

Related benchmarks:

Array concat vs spread operator vs push2 (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

Created: 3 years ago by: Guest

Jump to the latest result

Array.prototype.concat

spread operator

Push

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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