Benchmark: JavaScript Array Copy

JavaScript Array Copy (version: 0)

Testing the results for the fastest approach of shallow copying an array in JavaScript (concat, slice, for loop, and while loop).

Comparing performance of: Array.concat vs Array.slice vs For loop vs For loop with declared length vs While loop vs Spread operator vs Slice with begin argument vs Slice with begin and end argument

Created: 4 years ago by: Guest

Jump to the latest result

Script Preparation code:

var arrayToCopy = [ "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello", "hello" ];
var shallowCopy = [];

Tests:

Array.concat
shallowCopy = arrayToCopy.concat();
Array.slice
shallowCopy = arrayToCopy.slice();
For loop
for (let i = 0; i < arrayToCopy.length; ++i) { shallowCopy.push(arrayToCopy[i]); }
For loop with declared length
var arrayLength = arrayToCopy.length; for (let i = 0; i < arrayLength; ++i) { shallowCopy.push(arrayToCopy[i]); }
While loop
let i = arrayToCopy.length - 1; while (i--) { shallowCopy.push(arrayToCopy[i]); }
Spread operator
shallowCopy = [...arrayToCopy];
Slice with begin argument
shallowCopy = arrayToCopy.slice(0);
Slice with begin and end argument
shallowCopy = arrayToCopy.slice(0, arrayToCopy.length);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.concat
Array.slice
For loop
For loop with declared length
While loop
Spread operator
Slice with begin argument
Slice with begin and end argument

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36

Browser/OS: Chrome 131 on Windows

View result in a separate tab

Test name	Executions per second
Array.concat	3315429.5 Ops/sec
Array.slice	3300158.2 Ops/sec
For loop	92925.7 Ops/sec
For loop with declared length	129563.4 Ops/sec
While loop	138394.5 Ops/sec
Spread operator	3327695.5 Ops/sec
Slice with begin argument	3431885.8 Ops/sec
Slice with begin and end argument	2225193.0 Ops/sec

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

LLMs can make mistakes. Check important info.

The provided JSON represents a JavaScript benchmark test case on MeasureThat.net, designed to compare the performance of different methods for shallow copying an array in JavaScript.

**Methods being compared:**

1. `Array.concat()`
2. `Array.slice()`
3. `For loop` with and without declared length
4. `While loop`
5. Spread operator (`[...]`)
6. `Array.slice()` with begin argument

**Pros and cons of each approach:**

1. **Array.concat():**
	* Pros: Simple, easy to implement.
	* Cons: Creates a new array object, which can lead to performance issues for large arrays.
2. **Array.slice():**
	* Pros: Fast, efficient way to create a shallow copy of an array.
	* Cons: May not be suitable for large arrays due to memory constraints.
3. **For loop with declared length:**
	* Pros: Can be more efficient than `Array.slice()` when dealing with large arrays.
	* Cons: Requires manual management of the loop counter and array indexing, which can add complexity.
4. **While loop:**
	* Pros: Similar to the for loop approach but uses a different looping mechanism.
	* Cons: May not be as straightforward or efficient as other methods.
5. **Spread operator (`[...]`):**
	* Pros: Simple, modern way to create a shallow copy of an array.
	* Cons: Only supported in ECMAScript 2018 and later.
6. **Array.slice() with begin argument:**
	* Pros: Allows for more control over the slice operation, which can be beneficial when working with specific array segments.

**Other considerations:**

* The benchmark results are influenced by factors such as JavaScript engine implementation, browser version, operating system, and hardware.
* The performance differences between methods may vary depending on the specific use case or scenario.
* Some methods, like `Array.slice()` with begin argument, offer more flexibility but may require additional setup.

**Libraries used:**

None mentioned in the provided JSON. However, some libraries might be used for testing purposes (e.g., benchmarking libraries).

**Special JavaScript features/syntax:**

None explicitly mentioned in the provided JSON.

Related benchmarks: