Benchmark: Array.prototype.concat vs spread operator11

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 ]

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.prototype.concat
spread operator

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark definition and test cases.

**Benchmark Definition**
The benchmark compares two approaches for concatenating arrays in JavaScript: the traditional `Array.prototype.concat()` method and the new ES6 spread operator (`...`).

**Script Preparation Code and Html Preparation Code**
Since both script preparation code and html preparation code are null, it means that no additional setup or configuration is required before running the test cases.

**Individual Test Cases**

### Test Case 1: `Array.prototype.concat`

This test case involves creating an array `params` with three elements: a string, a boolean, and an integer. Then, it creates another array `other` by concatenating `params` to an existing array `[1, 2]` using the traditional `concat()` method.

**Pros of using `Array.prototype.concat`:**

* It is a well-established and widely supported method in JavaScript.
* It allows for more control over the resulting array (e.g., preserving the original array's length).

**Cons of using `Array.prototype.concat`:**

* It can be slower than the spread operator, especially for large arrays.
* It requires explicit function calls or methods (e.g., `concat()`), which can lead to code duplication.

### Test Case 2: Spread Operator (`...`)

This test case is similar to the previous one, but instead of using `concat()`, it uses the spread operator (`...`) to concatenate the arrays. The syntax `var other = [1, 2, ...params]` distributes the elements of `params` among the existing array `[1, 2]`.

**Pros of using the spread operator:**

* It is generally faster than `concat()`, especially for large arrays.
* It provides a more concise and expressive syntax.

**Cons of using the spread operator:**

* It requires support for the new ES6 syntax (introduced in ECMAScript 2015).
* Some developers may find it less intuitive or harder to understand than `concat()`.

**Library Used**
In this benchmark, no specific library is used. However, if a custom implementation were required, some libraries like Lodash (`_.concat()`) or Array.prototype extension methods (e.g., using `Array.prototype.push.apply()`) might be employed.

**Special JS Feature/Syntax**
This benchmark uses the ES6 spread operator syntax (`...`). This feature was introduced in ECMAScript 2015 and allows for concise array concatenation. It is widely supported by modern browsers, including Firefox 65.

**Other Alternatives**

Besides `Array.prototype.concat()` and the spread operator, other methods for concatenating arrays include:

* Using a simple loop to append elements: `other.push(...params)`
* Utilizing a library like Lodash (`_.concat()`)
* Employing a custom implementation using `Array.prototype.push.apply()`

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:65.0) Gecko/20100101 Firefox/65.0

Browser/OS: Firefox 65 on Windows 7

View result in a separate tab

Test name	Executions per second
Array.prototype.concat	9183456.0 Ops/sec
spread operator	6504952.5 Ops/sec

Related benchmarks:

Array.prototype.concat vs spread operator11 (version: 0)

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

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

Created: 5 years ago by: Guest

Jump to the latest result

Array.prototype.concat

spread operator

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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