Build successful! You can test your changes in the REPL here: https://babeljs.io/repl/build/48166/

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 3e5a731:

From the article linked by @JLHwung:

If you find Array.prototype.push.apply(arr1, arr2) verbose, you can use a simple variant using the rest spread ES6 syntax:

arr1.push(...arr2)

The performance difference between Array.prototype.push.apply(arr1, arr2) and arr1.push(...arr2) is negligable.

Unless we have data showing that the first one is actually better, we can probably use the second one (except for in the helper). I'd expect all engines to optimize the spread operator when arr2 is an array and arr2[Symbol.iterator] is the built-in array iterator.

These are the results of a bench with JSbench.me. Getting a 25-30% more perf for free doesn't sound bad to me, what do you think?

// Setup
let arr0 = []
let arr1 = [0, 1]

// .push(...arr)
for (let i = 0; i < 2; i++) {
	arr0.push(...arr1)
}

// .concat(arr)
for (let i = 0; i < 2; i++) {
	arr0 = arr0.concat(arr1)
}

// .push.apply(this, arr)
for (let i = 0; i < 2; i++) {
	Array.prototype.push.apply(arr0, arr1)
}

Results:
.push 4970969 ops/s ± 1.23% | 28.8% slower
.concat 37578 ops/s ± 3.29% | 99.46 slower
.push.apply 6981916 ops/s ± 1.09% | Fastest

I have setup a benchmark case here: .push(...arr) is as fast asArray.prototype.push.apply in V8 (expected) but the former is 30% slower than the latter in Firefox.

Anyway, Array.prototype.push.apply is almost identical to arr.push.apply().

Probably jsbench.me uses the browser engine to run the tests, so it used WebKit for mine.

Getting a 25-30% more perf for free

That really depends on the engine. For me on FF90, the difference is only about 1%. And for the tiny arrays you used, a custom function is much faster:

// Setup
let arr0 = []
let arr1 = Array.from({length:10}, (_, i) => i);
let N = 10;

function extend(dest, src) {
	const end = src.length;
	for (let di = dest.length, si = 0; si < end; ) {
		dest[di++] = src[si++];
	}
}

// .push(...arr)
for (let i = 0; i < N; i++) {
	arr0.push(...arr1)
}

// .push.apply(this, arr)
for (let i = 0; i < N; i++) {
	Array.prototype.push.apply(arr0, arr1)
}

// extend(dest, src)
for (let i = 0; i < N; i++) {
	extend(arr0, arr1);
}

// .push(...arr) — 215666.98 ops/s ± 1.34%
43.66 % slower

// .push.apply(this, arr) — 215674.72 ops/s ± 1.11%
43.66 % slower

// extend(dest, src) — 382775.7 ops/s ± 5.87%
Fastest

When I increase the source array length to 20, the custom function still wins by ~20%. It starts losing somewhere around length 50. For longer arrays it is slower, but it doesn't have a length limit like .push, e.g. in node:

Array.prototype.push.apply([], {length:125000});
Uncaught RangeError: Maximum call stack size exceeded

This code is going to run in V8 (Node.js) 99.9% of the times. Running @JLHwung's jsbench I get these results:

• .push(...arr) 14,582,342.47 ops/s ± 2.01% (fastest)
• Array.prototype.push.apply 13,373,289.89 ops/s ± 1.86% (8.29% slower)
• arr.push.apply 13,429,936.82 ops/s ± 2.14% (7.9% slower)
• arr.concat 85,879.34 ops/s ± 0.84% (99.41% slower)

The push versions are are similarly fast, so we can just use what's more readable (.push(...arr)).