Run results for: Array concat vs spread operator vs push large

Run details:

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

Browser: Chrome 113

Operating system: Windows

Device Platform: Desktop

Date tested: one year ago

Test name	Executions per second
Array.prototype.concat	1347.6 Ops/sec
spread operator	572.4 Ops/sec
Push	0.0 Ops/sec
loop with singular push	59.0 Ops/sec

HTML Preparation code:


<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js'></script>

Script Preparation code:

var arr1 = [];
var arr2 = [];

for (let i = 0; i < 200000; i += 1) {
    arr1.push(i);
}
for (let i = 0; i < 5000; i += 1) {
    arr2.push(-1 * i);
}

Tests:

Array.prototype.concat
var other = arr1.concat(arr2);
spread operator
var other = [...arr1, ...arr2]
Push
var other = []; other.push(...arr1); other.push(...arr2);
loop with singular push
var other = []; for (let i = 0; i < arr1.length; i += 1) { other.push(arr1[i]); } for (let i = 0; i < arr2.length; i += 1) { other.push(arr2[i]); }

Run results for: Array concat vs spread operator vs push large

Compare the new ES6 spread operator with the traditional concat() method and push

Array.prototype.concat

spread operator

Push

loop with singular push