Benchmark: Spread vs concat vs forEach array v1001

Tests:

concat
const arr1 = Array.from({ length: 5000}).map((_, i) => i); const arr2 = Array.from({ length: 5000}).map((_, i) => i); const arr3 = Array.from({ length: 5000}).map((_, i) => i); const finallArr1 = arr1.concat(arr2).concat(arr3);
forEach
const arr1 = Array.from({ length: 5000}).map((_, i) => i); const arr2 = Array.from({ length: 5000}).map((_, i) => i); const arr3 = Array.from({ length: 5000}).map((_, i) => i); const finalArr2 = []; arr1.forEach((e) => finalArr2.push(e)); arr2.forEach((e) => finalArr2.push(e)); arr3.forEach((e) => finalArr2.push(e));
spread
const arr1 = Array.from({ length: 5000}).map((_, i) => i); const arr2 = Array.from({ length: 5000}).map((_, i) => i); const arr3 = Array.from({ length: 5000}).map((_, i) => i); const finalArr3 = [...arr1, ...arr2, ...arr3];

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
concat
forEach
spread

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 provided benchmark and explain what's being tested.

**Benchmark Purpose**

The benchmark is designed to compare the performance of three different methods for concatenating arrays:

1. `concat()`
2. Using the spread operator (`...`)
3. Using `forEach()` with a callback function

**Options Compared**

* `concat()`: uses the `Array.prototype.concat()` method to concatenate two or more arrays.
* Spread Operator (`...`): uses the spread operator to merge one or more arrays into a new array.
* `forEach()` with a callback function: uses the `Array.prototype.forEach()` method to iterate over an array and perform a specified action on each element.

**Pros and Cons of Each Approach**

1. **concat()**:
	* Pros: widely supported, easy to read and write.
	* Cons: can be slower than spread operator for large arrays due to the creation of intermediate arrays.
2. **Spread Operator (`...`)**:
	* Pros: faster, more concise, and efficient for merging arrays.
	* Cons: may not be supported in older browsers or versions of JavaScript.
3. **forEach() with a callback function**:
	* Pros: can be useful when you need to perform multiple operations on each array element.
	* Cons: may not be as efficient as spread operator due to the overhead of iterating over the array.

**Library Used**

In this benchmark, no specific library is used beyond the standard JavaScript functions (e.g., `Array.prototype.concat()`, `Array.prototype.forEach()`).

**Special JS Feature or Syntax**

The benchmark uses a feature that was introduced in ECMAScript 2015 (ES6): the spread operator (`...`). This feature allows you to merge arrays using a concise syntax.

**Other Considerations**

* The benchmark creates an array of length 5000 and populates it with values from 0 to 4999 using `Array.from()`.
* Each test case uses the same initial array creation code, which minimizes the impact of differences in JavaScript execution engines.
* The benchmark is run on a single device (Macintosh with Firefox 120) for each test case.

**Alternatives**

Other alternatives for concatenating arrays could include:

* Using `Array.prototype.push()` to append elements to an existing array:
```javascript
const arr1 = [1, 2, 3];
arr1.push(4, 5, 6);
```
* Using a loop with `push()` or `unshift()` to concatenate arrays:
```javascript
const arr1 = [1, 2, 3];
let finalArr = [];
for (let i = 0; i < 5000; i++) {
  finalArr.push(i + 1);
}
```
However, these alternatives are generally less efficient and more verbose than the methods used in this benchmark.

Latest run results:

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

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

Browser/OS: Firefox 120 on Mac OS X 10.15

View result in a separate tab

Test name	Executions per second
concat	4438.2 Ops/sec
forEach	2625.2 Ops/sec
spread	2939.9 Ops/sec

Related benchmarks:

Spread vs concat vs forEach array v1001 (version: 0)

Comparing performance of: concat vs forEach vs spread

Created: one year ago by: Guest

Jump to the latest result

concat

forEach

spread

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):