Benchmark: 2D array copy - slice vs spread operator vs loop

Tests:

Array.prototype.slice
let param = new Array(50); for (let a = 0; a < 50; a++) { param[a] = new Array(50); for (let b = 0; b < 50; b++) { param[a][b] = b; } } let ans = []; for (let i = 0; i < param.length; i++) { ans.push(param[i].slice()); }
spread operator
let param = new Array(50); for (let a = 0; a < 50; a++) { param[a] = new Array(50); for (let b = 0; b < 50; b++) { param[a][b] = b; } } let ans = []; for (let i = 0; i < 50; i++) { ans.push([...param[i]]); }
simple loop
let param = new Array(50); for (let a = 0; a < 50; a++) { param[a] = new Array(50); for (let b = 0; b < 50; b++) { param[a][b] = b; } } let ans = []; for (let i = 0; i < 50; i++) { ans.push([]); for(let j = 0; j < 50; j++) { ans[i].push(param[i][j]); } }
placement loop
let param = new Array(50); for (let a = 0; a < 50; a++) { param[a] = new Array(50); for (let b = 0; b < 50; b++) { param[a][b] = b; } } let ans = []; for (let i = 0; i < 50; i++) { ans.push([]); for(let j = 0; j < 50; j++) { ans[i][j] = param[i][j]; } }
pre-built array loop
let param = new Array(50); for (let a = 0; a < 50; a++) { param[a] = new Array(50); for (let b = 0; b < 50; b++) { param[a][b] = b; } } let ans = new Array(50); for (let i = 0; i < 50; i++) { ans[i] = new Array(50); for(let j = 0; j < 50; j++) { ans[i][j] = param[i][j]; } }
optimizing slice
let param = new Array(50); for (let a = 0; a < 50; a++) { param[a] = new Array(50); for (let b = 0; b < 50; b++) { param[a][b] = b; } } let ans = new Array(50); for (let i = 0; i < param.length; i++) { ans[i] = param[i].slice(); }
optimizing spread operator
let param = new Array(50); for (let a = 0; a < 50; a++) { param[a] = new Array(50); for (let b = 0; b < 50; b++) { param[a][b] = b; } } let ans = new Array(50); for (let i = 0; i < param.length; i++) { ans[i] = [...param[i]]; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.prototype.slice
spread operator
simple loop
placement loop
pre-built array loop
optimizing slice
optimizing spread operator

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

I'll break down the benchmark and explain the results.

**Benchmark Overview**

The benchmark consists of multiple test cases, each measuring the performance of different approaches for creating a copy of an array in JavaScript:

1. `Array.prototype.slice()`
2. Using the spread operator (`...`)
3. Optimized versions of the above two (marked as "optimizing slice" and "optimizing spread operator")
4. Two other approaches: "placement loop" and "pre-built array loop"

**Performance Comparison**

The benchmark measures the number of executions per second for each test case across multiple browser runs on a desktop device.

Here's a summary of the results:

* **`Array.prototype.slice()`**: 89418.75 executions/second
* **Using the spread operator (`...`)**: 75147.515625 executions/second
* **Optimized version of `slice()`**: 91354.1796875 executions/second ( fastest)
* **Optimized version of spread operator**: 74597.359375 executions/second
* **Placement loop**: 46858.73046875 executions/second ( slowest)
* **Pre-built array loop**: 45792.75390625 executions/second

**Insights**

1. The optimized `slice()` approach outperforms the original spread operator method.
2. Optimizing the spread operator also improves its performance.
3. Both `placement loop` and `pre-built array loop` approaches are slower than the other methods.

The results suggest that:

* Creating a copy of an array using `Array.prototype.slice()` is generally faster than using the spread operator.
* Optimizations for both `slice()` and the spread operator can significantly improve performance.
* The `placement loop` approach is much slower, likely due to its inefficient algorithm.

Keep in mind that these results may not generalize across all browsers, devices, or edge cases. However, they provide a general insight into the relative performance of different approaches for creating an array copy in JavaScript.

Latest run results:

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

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

Browser/OS: Chrome 128 on Windows

View result in a separate tab

Test name	Executions per second
Array.prototype.slice	89418.8 Ops/sec
spread operator	75147.5 Ops/sec
simple loop	46007.3 Ops/sec
placement loop	46858.7 Ops/sec
pre-built array loop	45792.8 Ops/sec
optimizing slice	91354.2 Ops/sec
optimizing spread operator	74597.4 Ops/sec

Related benchmarks:

2D array copy - slice vs spread operator vs loop (version: 0)

Compare 2D array copy with the spread operator vs slice vs loop

Comparing performance of: Array.prototype.slice vs spread operator vs simple loop vs placement loop vs pre-built array loop vs optimizing slice vs optimizing spread operator

Created: one month ago by: Guest

Jump to the latest result

Array.prototype.slice

spread operator

simple loop

placement loop

pre-built array loop

optimizing slice

optimizing spread operator

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