Benchmark: Array: concat vs spread operator vs push with spread operator

Script Preparation code:

var numbers = [...Array(1000).keys()]
var arr = [numbers, numbers, numbers, numbers, numbers]

Tests:

concat
var results = arr.reduce((acc, cur) => acc.concat(cur), []);
spread operator
var results = arr.reduce((acc, cur) => [...acc, ...cur], []);
push with spread operator
var results = arr.reduce((acc, cur) => { acc.push(...cur); return acc; }, []);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
concat
spread operator
push with spread operator

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

Let's break down the provided JSON benchmark data and explain what is being tested.

**Benchmark Definition:**
The benchmark defines three test cases, each measuring the performance of a different approach to concatenate arrays:

1. **concat**: Using the `concat` method with the spread operator (`...`) on an array.
2. **spread operator**: Directly using the spread operator (`...`) to concatenate two arrays.
3. **push with spread operator**: Using the `push` method with the spread operator (`...`) to add elements to an existing array.

**Script Preparation Code:**
The script prepares an array of numbers and creates a main array by repeating it five times:
```javascript
var numbers = [...Array(1000).keys()]
var arr = [numbers, numbers, numbers, numbers, numbers]
```
This array has 5000 elements, which will be used for the benchmark.

**Test Cases:**
The three test cases are defined as follows:

1. **concat**: Reduces the main array to a single value by concatenating it with an empty array using the `concat` method.
```javascript
var results = arr.reduce((acc, cur) => acc.concat(cur), [])
```
2. **spread operator**: Directly uses the spread operator (`...`) to concatenate two arrays.
```javascript
var results = arr.reduce((acc, cur) => [...acc, ...cur], [])
```
3. **push with spread operator**: Uses the `push` method with the spread operator (`...`) to add elements to an existing array.
```javascript
var results = arr.reduce((acc, cur) => {
  acc.push(...cur);
  return acc;
}, [])
```
**Library and Purpose:**
The benchmark uses built-in JavaScript methods and features, without any external libraries.

**Special JS Features or Syntax:**
None of the test cases use special JavaScript features or syntax that would affect performance in a significant way. The benchmark focuses on comparing the performance of different array concatenation approaches.

**Other Considerations:**

* The benchmark measures the number of executions per second (`ExecutionsPerSecond`) for each test case.
* The test cases are run on Chrome 87, with a Windows Desktop platform and Operating System.
* The benchmark is repeated multiple times (not specified in the provided data), but the results provide an average execution time.

**Alternatives:**

* Other array concatenation methods, such as using `Array.prototype.reduce` or custom loops, could be tested to compare their performance.
* Using external libraries like Lodash or Ramda might offer optimized implementations for array concatenation, potentially affecting benchmark results.
* Testing different browser versions or platforms could reveal variations in execution times and hardware-dependent factors.

By understanding the test cases, script preparation code, and library used, you can better comprehend the benchmark's purpose and performance characteristics.

Related benchmarks:

Array: concat vs spread operator vs push with spread operator (version: 0)

Comparing performance of: concat vs spread operator vs push with spread operator

Created: 5 years ago by: Guest

Jump to the latest result

concat

spread operator

push with spread operator

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):