Benchmark: Array.prototype.concat vs spread operator vs contact empty array with 2 arrays

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 ]
Concat empty array
var params = [ "hello", true, 7 ]; var other = [].concat([1, 2], params);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.prototype.concat
spread operator
Concat empty array

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.1:latest, generated 28 days ago):

LLMs can make mistakes. Check important info.

Let's dive into the details of this benchmark.

**Benchmark Description**

The benchmark compares three different ways to concatenate arrays in JavaScript: `Array.prototype.concat`, the spread operator (`...`), and concatenating an empty array with two other arrays.

**Test Cases**

There are three test cases:

1. **Array.prototype.concat**: This test uses the traditional `concat()` method to concatenate two arrays.
	* Code: `[1, 2].concat([ "hello", true, 7 ])`
	* Library: None
	* Special JS feature/syntax: None
	* Description: The `concat()` method creates a new array that contains all elements from the original array and the specified array(s).
	* Pros:
		+ Well-established and widely supported.
		+ Easy to understand and use.
	* Cons:
		+ Can be slower than other methods for large arrays.

2. **Spread operator**: This test uses the spread operator (`...`) to concatenate two arrays.
	* Code: `[1, 2, ...[ "hello", true, 7 ]]`
	* Library: None
	* Special JS feature/syntax: Spread operator (`...`)
	* Description: The spread operator unpacks an array into individual elements, which can then be concatenated with another array.
	* Pros:
		+ More concise and readable than `concat()` for simple cases.
		+ Can improve performance in some scenarios.
	* Cons:
		+ May not be as well-established or widely supported as `concat()`.
		+ Can be slower than `concat()` for very large arrays.

3. **Concat empty array**: This test concatenates an empty array with two other arrays using the `concat()` method.
	* Code: `[] .concat([1, 2], [ "hello", true, 7 ])`
	* Library: None
	* Special JS feature/syntax: None
	* Description: Creating an empty array and then concatenating it with other arrays can be a more efficient approach than using `concat()` directly.
	* Pros:
		+ Can improve performance in some scenarios by avoiding the creation of intermediate arrays.
	* Cons:
		+ May not be as intuitive or easy to understand as the other methods.

**Latest Benchmark Results**

The latest benchmark results show that:

* The spread operator (`...`) is the fastest method, with an average execution rate of 165689824.0 per second on a mobile Safari device running iOS 16.1.
* `Array.prototype.concat` is slower, with an average execution rate of 12342266.0 per second on the same device.
* Concatenating an empty array is even slower, with an average execution rate of 3831363.25 per second on the same device.

**Other Alternatives**

If you're looking for alternative ways to concatenate arrays in JavaScript, consider using:

* `Array.prototype.push`: You can use `push()` to add individual elements from one array to another.
* `Map` or `Set` operations: If you need to perform more complex operations on your data, consider using a `Map` or `Set` instead of an array.

Remember that the best approach depends on your specific use case and requirements.

Latest run results:

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

User agent: Mozilla/5.0 (iPhone; CPU iPhone OS 16_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148 Safari Line/13.2.0

Browser/OS: Mobile Safari 16 on iOS 16.1

View result in a separate tab

Test name	Executions per second
Array.prototype.concat	12342266.0 Ops/sec
spread operator	165689824.0 Ops/sec
Concat empty array	3831363.2 Ops/sec

Related benchmarks:

Array.prototype.concat vs spread operator vs contact empty array with 2 arrays (version: 0)

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

Comparing performance of: Array.prototype.concat vs spread operator vs Concat empty array

Created: one year ago by: Guest

Jump to the latest result

Array.prototype.concat

spread operator

Concat empty array

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.1:latest, generated 28 days ago):