Difference between using a spread syntax (...) and push.apply, when dealing with arrays
Both Function.prototype.apply and the spread syntax may cause a stack overflow when applied to large arrays:
let xs = new Array(500000), ys = [], zs;xs.fill("foo");try { ys.push.apply(ys, xs);} catch (e) { console.log("apply:", e.message)}try { ys.push(...xs);} catch (e) { console.log("spread:", e.message)}zs = ys.concat(xs);console.log("concat:", zs.length)Use Array.prototype.concat instead. Besides avoiding stack overflows concat has the advantage that it also avoids mutations. Mutations are considered harmful, because they can lead to subtle side effects.
But that isn't a dogma. If you are wihtin a function scope and perform mutations to improve performance and relieve garbage collection you can perform mutations, as long as they aren't visible in the parent scope.
Apart from what ftor pointed out, Array.prototype.concat is, on average, at least 1.4x faster than the array spread operator.
See results here:https://jsperf.com/es6-add-element-to-create-new-array-concat-vs-spread-op
You can run the test on your own browser and machine here: https://www.measurethat.net/Benchmarks/Show/579/1/arrayprototypeconcat-vs-spread-operator
Interpreting the question as which is more performant in general, using .push() as an example it looks like apply is [only slightly] faster (except for MS Edge, see below).
Here's a performance test on just the overhead on calling a function dynamically for the two methods.
function test() { console.log(arguments[arguments.length - 1]); }var using = (new Array(200)).fill(null).map((e, i) => (i));test(...using);test.apply(null, using)I tested in Chrome 71.0.3578.80 (Official Build) (64-bit), FF 63.0.3 (64-bit), & Edge 42.17134.1.0, and these were my resulsts after running them a few times on their own The initial results were always skewed one way or the other
As you can see Edge seems to have a better implementation for apply than it does for ... (but don't try to compare the results across browsers, we cant tell whether Edge has a better apply than the others, a worse ..., or a bit of both from this data).
Given this, unless you're targeting Edge specifically, I'd say go with ... just as it reads cleaner, especially if you need to pass an object back in to apply for this.
It's possible that it's dependent on the size of the array, too, so like @Jaromanda X said, do your own testing and change 200 if you need to really make sure.
The other answers interpreted the question as which would be better for .push() specifically, and get caught up on the 'problem' being solved, simply recommending to just use .concat(), which is basically the standard why are you doing it that way? which can irk some people coming from google that aren't looking for solutions to do with .push() (say, Math.max, or your own custom function).