Benchmark: Array.prototype.concat vs spread operator

Tests:

Array.prototype.concat
var params = [ "hello", true, 7 ] var other = [...params, 2]
spread operator
var params = [ "hello", true, 7 ] var other = [ ...params, 2 ]

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 29 days ago):

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net.

**Benchmark Overview**

The benchmark in question compares two approaches to concatenate an array: the traditional `Array.prototype.concat()` method and the new ES6 spread operator (`...`). The test cases use a small array `params` with three elements: a string, a boolean, and a number. Each test case attempts to create a new array by concatenating the original array with another element using either of the two methods.

**Options Compared**

The benchmark compares two options:

1. **Traditional `Array.prototype.concat()` method**: This method creates a new array by copying all elements from the original array and adding one or more elements from an additional array.
2. **New ES6 spread operator (`...`)**: This operator creates a new array by copying all elements from the original array and adding one or more elements after the `...`.

**Pros and Cons of Each Approach**

1. **Traditional `Array.prototype.concat()` method**
	* Pros:
		+ Widely supported in older browsers and JavaScript engines.
		+ More predictable behavior, as the resulting array is a new array with the concatenated elements.
	* Cons:
		+ Can be slower than the spread operator due to the overhead of creating a new array.
		+ May not optimize well for modern JavaScript engines that support the spread operator.
2. **New ES6 spread operator (`...`)**
	* Pros:
		+ Faster and more efficient, as it uses a single operation to create the new array.
		+ More concise and readable code.
	* Cons:
		+ May not work in older browsers or JavaScript engines that don't support the spread operator.
		+ Behavior can be different from traditional `concat()` method if used with certain types of arrays (e.g., sparse arrays).

**Library Usage**

None.

**Special JS Features/Syntax**

The benchmark uses ES6 syntax for the spread operator (`...`), which is a feature introduced in ECMAScript 2015. This feature allows for more concise and expressive code, especially when working with arrays.

**Other Alternatives**

If you need to concatenate arrays in JavaScript, there are other options besides the traditional `Array.prototype.concat()` method and the ES6 spread operator:

1. **`Array.push()`**: You can use `push()` to add one or more elements to an array.
2. **`Array.from()`**: You can use `Array.from()` to create a new array from an iterable (e.g., an array, string, or object).
3. **`Array.reduce()`**: You can use `reduce()` to concatenate arrays by reducing the array to a single value.

Keep in mind that these alternatives may have different performance characteristics and behaviors compared to the traditional `concat()` method and the spread operator.

Latest run results:

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

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.183 Safari/537.36 Vivaldi/1.96.1147.19

Browser/OS: Chrome 65 on Linux

View result in a separate tab

Test name	Executions per second
Array.prototype.concat	3033255.0 Ops/sec
spread operator	3017837.8 Ops/sec

Related benchmarks:

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

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

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

Created: 6 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 29 days ago):