Run results for: Ways to copy an array

Run details:

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

Browser: Chrome 132

Operating system: Windows

Device Platform: Desktop

Date tested: one month ago

Test name	Executions per second
✓ [...]	126,711 Ops/sec
length + push + ...	12,001 Ops/sec
length + forEach + index	11,125 Ops/sec
splice + push + ...	10,009 Ops/sec
splice + forEach + index	9,192 Ops/sec
length + forEach + push	6,414 Ops/sec
splice + forEach + push	5,132 Ops/sec
length + Object.assign	110 Ops/sec

Script Preparation code:

const source1 = Array.from({length: 10_000}, () => Math.floor(Math.random() * 10_000_000));
const source2 = Array.from({length: 20_000}, () => Math.floor(Math.random() * 10_000_000));

Tests:

[...]
let result = source1; result = [...source2]; return result;
length + push + ...
const result = source1; result.length = 0; result.push(...source2); return result;
length + forEach + push
const result = source1; result.length = 0; source2.forEach(x => result.push(x)); return result;
length + forEach + index
const result = source1; result.length = 0; result.length = source2.length; source2.forEach((x, i) => (result[i] = x)); return result;
splice + push + ...
const result = source1; result.splice(0); result.push(...source2); return result;
splice + forEach + push
const result = source1; result.splice(0); source2.forEach(x => result.push(x)); return result;
splice + forEach + index
const result = source1; result.splice(0); result.length = source2.length; source2.forEach((x, i) => (result[i] = x)); return result;
length + Object.assign
const result = source1; result.length = 0; Object.assign(result, source2); return result;

Run results for: Ways to copy an array

Reactive arrays cannot be completely changed in VueJS. We need to change the elements. Here are ways to do this without losing reactivity. The first test is a reference test and is not applicable for reactive arrays.

[...]

length + push + ...

length + forEach + push

length + forEach + index

splice + push + ...

splice + forEach + push

splice + forEach + index

length + Object.assign