String concatenation versus array.join() in JavaScript
January 19th, 2010To answer a question on StackOverflow, I made an experiment which actually qualifies for a separate blog post.
So, I compared the speed of str1+str2 concatenation and array.push(str1, str2).join() methods.
The code I used was quite simple:
var iIterations =800000;
var d1 = (new Date()).valueOf();
str1 = "";
for (var i = 0; i<iIterations; i++) str1 = str1 + Math.random().toString();
var d2 = (new Date()).valueOf();
log("Time (strings): " + (d2-d1));
var d3 = (new Date()).valueOf();
arr1 = [];
for (var i = 0; i<iIterations; i++)arr1.push(Math.random().toString());
var str2 = arr1.join("");
var d4 = (new Date()).valueOf();
log("Time (arrays): " + (d4-d3));
I tested it in IE8 and FireFox 3.5.5, both on a Windows 7 x64.
In the beginning I tested on small number of iterations (some hundred, some thousand items). The results were unpredictable (sometimes string concatenation took 0 milliseconds, sometimes it took 16 milliseconds, the same for array joining).
When I increased the count to 50′000, the results were different in different browsers – in IE the string concatenation was faster (94 milliseconds) and join was slower(125 milliseconds), while in Firefox the array join was faster (113 milliseconds) than string joining (117 milliseconds).
Then I increased the count to 500′000. Now the array.join() was slower than string concatenation in both browsers: string concat 937ms in IE, 1155 ms in Firefox, array join 1265 in IE, 1207 in Firefox.
Maximum iteration count I could test in IE without having “the script is taking too long to execute” was 850′000. Then IE was 1593 for string concatenation and 2046 for array join, Firefox had 2101 for string concatenation and 2249 for array join.
Results – if the number of iterations is small, you can try to use array.join(), as it might be faster in Firefox. When the number increases, the string1+string2 method is faster.
UPDATE
I performed the test on IE6 (WindowsXP). The process stopped to respond immediately and never ended, if I tried the test on more than 100′000 iterations.
On 40′000 iterations the results were
Time (strings): 59175 ms
Time (arrays): 220 ms
This means – if you need to support IE6, choose array.join() which is way faster than string concatenation.
