Benchmark: spread vs concat vs unshift to join arrays

Script Preparation code:

var a = [1,2,3];
var b = [4,5,6];

Tests:

spread
b=[...a,...b];
concat
b=a.concat(b);
unshift
b.unshift(a);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
spread
concat
unshift

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's dive into the explanation of the provided benchmark.

**Benchmark Overview**

The benchmark compares the performance of three ways to join two arrays in JavaScript: using the spread operator (`...`), `concat()`, and `unshift()` with an array.

**Options Compared**

1. **Spread Operator (Bare-Metal)**: This method uses the spread operator (`...`) to create a new array by copying elements from one or more source arrays.
2. **Concatenation using concat()**: This method uses the `concat()` function to concatenate two arrays, creating a new array with all elements from both arrays.
3. **Unshift()**: This method uses the `unshift()` function to add an element (or multiple elements) at the beginning of an array.

**Pros and Cons**

1. **Spread Operator**:
	* Pros: Fast and efficient, creates a new array without modifying the original one.
	* Cons: May not work correctly if used on non-array values or with certain types of data structures.
2. **Concatenation using concat()**:
	* Pros: Well-supported across most browsers and Node.js versions, works with any type of data.
	* Cons: Creates a new array, which can be memory-intensive for large datasets.
3. **Unshift()**:
	* Pros: Modifies the original array in place, potentially more memory-efficient than concatenation or spread operator.
	* Cons: Can be slower and less efficient than other methods, especially when dealing with large arrays.

**Library/Function Used**

None of the options used a dedicated library or function. However, `concat()` is a built-in JavaScript method, while `unshift()` is also a native array method.

**Special JS Feature/Syntax**

The benchmark does not use any special JavaScript features or syntax beyond what's required for these three methods.

**Other Alternatives**

If you need to join arrays in other ways, some alternatives include:

* Using the `reduce()` method: `b = b.reduce((acc, curr) => acc.concat([curr]), [])`
* Using a `for` loop with an array index variable
* Using the `map()` and `reduce()` methods together

Keep in mind that these alternatives may have different performance characteristics or requirements compared to the three methods being tested here.

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:100.0) Gecko/20100101 Firefox/100.0

Browser/OS: Firefox 100 on Mac OS X 10.15

View result in a separate tab

Test name	Executions per second
spread	1812.3 Ops/sec
concat	982.0 Ops/sec
unshift	382566.1 Ops/sec

Related benchmarks:

spread vs concat vs unshift to join arrays (version: 0)

Comparing the performance of spread, vs concat vs unshift to join two arrays

Comparing performance of: spread vs concat vs unshift

Created: 2 years ago by: Guest

Jump to the latest result

spread

concat

unshift

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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