Benchmark: spread large array (100 elements) performance (vs slice, splice, concat, for)

Script Preparation code:

testArray = [];
for (let i = 0; i < 100; i++) testArray.push(i)

Tests:

Splice
const newTestArray = testArray.splice(0);
Slice
const newTestArray = testArray.slice();
Concat
const newTestArray = testArray.concat();
Spread
const newTestArray = [...testArray];
For cycle with preallocation
const testArrLen = testArray.length; const resArr = new Array(testArrLen); for (let i = 0; i < testArrLen; i++) { resArr[i] = testArray[i]; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Splice
Slice
Concat
Spread
For cycle with preallocation

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's break down what's being tested in the provided JSON and analyze the different approaches.

**Benchmark Overview**

The benchmark measures the performance of creating a new array by spreading, slicing, concatenating, or using a for cycle with preallocation, compared to the original array `testArray`.

**Options Being Compared**

1. **Splice**: Removes elements from an array and returns them as a new array.
2. **Slice**: Creates a shallow copy of a portion of an array.
3. **Concat**: Concatenates two or more arrays into one.
4. **Spread**: Creates a new array by spreading the elements of an array (using the spread operator `...`).
5. **For cycle with preallocation**: Manually creates a new array and populates it with elements from the original array.

**Pros and Cons of Each Approach**

1. **Splice**:
	* Pros: Can be efficient for removing elements, as it only updates the reference to the element being removed.
	* Cons: Creates a new array, which can lead to increased memory usage and garbage collection overhead.
2. **Slice**:
	* Pros: Creates a shallow copy of a portion of an array, which can be useful if you need to preserve the original data structure.
	* Cons: Can be slower than other methods for large arrays, as it creates a new array with a reference to the original elements.
3. **Concat**:
	* Pros: Concatenates multiple arrays into one, which can be efficient for merging data from different sources.
	* Cons: Creates multiple intermediate arrays, which can lead to increased memory usage and garbage collection overhead.
4. **Spread**:
	* Pros: Creates a new array by spreading elements, which is often the most straightforward and efficient way to create a copy of an array.
	* Cons: Can be slower than other methods for very large arrays, as it creates a new array with references to the original elements.
5. **For cycle with preallocation**:
	* Pros: Manually controls memory allocation, which can lead to more predictable performance and reduced garbage collection overhead.
	* Cons: Requires manual effort to create the new array and populate it with elements from the original array.

**Library/Functionality Used**

None mentioned in this benchmark.

**Special JavaScript Features/Syntax**

The benchmark uses the spread operator `...` for spreading elements, which is a relatively recent addition to the JavaScript language (introduced in ECMAScript 2018).

**Other Alternatives**

1. **Array.prototype.reduce()**: Can be used to create a new array by accumulating values from an original array.
2. **Array.prototype.map()**: Can be used to create a new array with transformed elements from an original array.

Keep in mind that the performance of these alternatives may vary depending on the specific use case and JavaScript environment.

**Benchmark Results**

The benchmark results show the executions per second for each test case, which indicates the relative performance of each approach. The order of the results is as follows: Slice ( fastest ), Concat, Spread, Splice, For cycle with preallocation ( slowest ).

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.5060.114 Safari/537.36 Edg/103.0.1264.51

Browser/OS: Chrome 103 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Splice	5798981.0 Ops/sec
Slice	6528454.0 Ops/sec
Concat	6396047.5 Ops/sec
Spread	6200411.5 Ops/sec
For cycle with preallocation	3354135.2 Ops/sec

Related benchmarks:

spread large array (100 elements) performance (vs slice, splice, concat, for) (version: 0)

Comparing performance of: Splice vs Slice vs Concat vs Spread vs For cycle with preallocation

Created: 2 years ago by: Guest

Jump to the latest result

Splice

Slice

Concat

Spread

For cycle with preallocation

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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