Benchmark: Native concat() vs ES6 spread [2]

Script Preparation code:

random = () => Array(50).fill(Math.floor(Math.random() * 9))

arr1 = random();
arr2 = random();

Tests:

Array.prototype.concat
const other = arr1.concat(arr2);
spread operator
const other = [ ...arr1, ...arr2]

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 one month ago):

LLMs can make mistakes. Check important info.

Let's break down the benchmark and explain what's being tested.

**Benchmark Description**

The benchmark compares two approaches to concatenate arrays: the traditional `Array.prototype.concat()` method and the new ES6 spread operator (`[ ...arr1, ...arr2]`).

**Options Compared**

Two options are compared:

1. **Traditional `concat()` method**: This is the legacy way of concatenating arrays in JavaScript.
2. **ES6 spread operator**: A more concise way of concatenating arrays introduced in ECMAScript 2015.

**Pros and Cons**

* **Traditional `concat()` method**:
	+ Pros: widely supported, easy to use, and has been around for a long time.
	+ Cons: can be slower than the ES6 spread operator due to its overhead and creation of new arrays on each invocation.
* **ES6 spread operator**:
	+ Pros: more concise, efficient, and often faster than the traditional `concat()` method because it avoids creating new arrays and uses a single array operation.
	+ Cons: might not be as widely supported in older browsers or versions of JavaScript.

**Library Usage**

There is no explicit library usage mentioned in this benchmark. However, if you're interested in knowing about libraries that can simplify array concatenation, some popular ones include:

* Lodash (specifically `_.concat()`): A utility library for functional programming.
* Ramda: A functional programming library that includes a `concat` function.

**Special JS Feature/Syntax**

There are no special JavaScript features or syntax used in this benchmark. Both approaches use standard JavaScript syntax and do not rely on any advanced features like async/await, promises, or ES6 modules.

**Other Alternatives**

If you want to compare array concatenation methods with other alternatives, consider the following:

* Using `Array.prototype.reduce()` instead of `concat()`: This can be a more efficient approach in some cases.
* Using `Array.prototype.push()` multiple times: This can be slower than using `concat()` or the spread operator.

For this specific benchmark, the ES6 spread operator is likely to be faster and more efficient due to its optimized implementation and avoidance of unnecessary array creations.

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.89 Safari/537.36

Browser/OS: Chrome 84 on Windows 7

View result in a separate tab

Test name	Executions per second
Array.prototype.concat	270875.9 Ops/sec
spread operator	179211.3 Ops/sec

Related benchmarks:

Native concat() vs ES6 spread [2] (version: 0)

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

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

Created: 4 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 one month ago):