There is this test on jsperf :

It shows that concat is faster, but if you get that result in the initial array, without using a third variable, concat is much, much slower :

for (i = 10000; i > 0; i--) {
   arr1 = arr1.concat(arr2);
}

Even if you use a local var, but with the same name, the result is the same :

for (i = 10000; i > 0; i--) {
   var arr1 = arr1.concat(arr2);
}

Can someone explain this ?

There is this test on jsperf : http://jsperf./javascript-array-concat-vs-push

It shows that concat is faster, but if you get that result in the initial array, without using a third variable, concat is much, much slower :

for (i = 10000; i > 0; i--) {
   arr1 = arr1.concat(arr2);
}

Even if you use a local var, but with the same name, the result is the same :

for (i = 10000; i > 0; i--) {
   var arr1 = arr1.concat(arr2);
}

Can someone explain this ?

• javascript
• performance

• 1 Not sure I get the question, concat and push do different things, one joins two arrays, the other pushes to an array, but if you use some trickery with apply you can push all the values from one array to another array with a single line of code instead of iterations, but of course native methods are usually faster. – adeneo Commented Aug 16, 2014 at 11:45
• 1 Firstly, you're changing the conditions of the initial performance test notably: the appended array is larger on each iteration. Aside from that, if you don't use a third variable, a helper variable is created and destroyed on each iteration which would explain additional performance drop. – Etheryte Commented Aug 16, 2014 at 11:48
• 1 Your two examples are equivalent. Javascript variables have function scope, not block scope, so the variable declaration is hoisted out of the loop. – Barmar Commented Aug 16, 2014 at 11:50
• @adeneo If you look at the jsperf he linked to, it does use "trickery with apply" – Barmar Commented Aug 16, 2014 at 11:51
• It looks to me like that jsperf is paring apples and oranges. The concat test puts the result in a new variable, so it just concatenates the same two arrays multiple times. The push test is modifying one of the original arrays, so it keeps growing and growingon each iteration of the test. Your concat test is like that push test in the benchmark, because you're saving the result in arr1. That's why the performance is similar to the push benchmark. – Barmar Commented Aug 16, 2014 at 12:10

1 Answer 1

You're mutating the original array in a loop.

for (i = 10000; i > 0; i--) {
   arr1 = arr1.concat(arr2);
}

Here the size of arr1 keeps growing and as the array gets bigger it will get slower because it has to allocate more memory.

for (i = 10000; i > 0; i--) {
   var arr3 = arr1.concat(arr2);
}

Here you are assigning to a new variable without mutating arr1 or arr2 so your testing the performance of concatenating two small arrays.

In the arr1 case your testing the performance of concatenating one large array with a small one.