2

I was wondering if there is any difference in performance between the following statements to concatinate two strings str1='a' and str2='b' 

str1 = str1 + str2;

or

str1 += str2;

or

var res = str1.concat(str2);

I have tried the following to measure the performance but the output seems to vary a lot from one execution to another for the same statement.

var str1='a', str2='b';
var old_time=new Date();
for (var i=0; i<=1000000 ; i++){    
    str1=str1+str2;      // change this one with the other statements
}
var new_time=new Date();
console.log(new_time - old_time);
achref
  • 1,150
  • 1
  • 12
  • 28
  • 4
    did you create a [jsperf](https://jsperf.com/)? – Aᴍɪʀ Nov 21 '16 at 19:41
  • No I didn't know about the existence of this tool – achref Nov 21 '16 at 19:42
  • 2
    Possible duplicate of [What is the difference of + operator and concat() method in JavaScript](http://stackoverflow.com/questions/34465804/what-is-the-difference-of-operator-and-concat-method-in-javascript) – Wondercricket Nov 21 '16 at 19:42
  • 3
    The performance will probably vary on different JS engines. You should first evaluate whether you actually have a situation where the performance matters, and if it does, you should do a systematic test using something like jsperf (as @Aᴍɪʀ mentioned). – Asad Saeeduddin Nov 21 '16 at 19:42
  • 1
    This kind of micro-optimization is rarely worth fretting over. You’re better off using the implementation that is the clearest. In this case, I would opt for version 1 or 2. See http://softwareengineering.stackexchange.com/questions/99445/is-micro-optimisation-important-when-coding – Ted Whitehead Nov 21 '16 at 19:44

2 Answers2

1

According to MDN: "It is strongly recommended that assignment operators (+, +=) are used instead of the concat() method. See this performance test."

Scott Marcus
  • 64,069
  • 6
  • 49
  • 71
  • 1
    I haven't voted, but this is [a link-only answer](http://meta.stackexchange.com/questions/8231/are-answers-that-just-contain-links-elsewhere-really-good-answers). – ssube Nov 21 '16 at 19:50
  • IMO not much more needs to be said and the link comes from a definitive source, clearly answering the question: (*I was wondering if there is any difference in performance between the following statements*). – Scott Marcus Nov 21 '16 at 19:54
1

Whereas

str1 += str2;

would appear to be a tad faster than str1 = str1 + str2; BUT since strings are immutable you cannot reuse old reference from str1. example:

str0 = str1;   // duplicate reference
str1 += str2;

str0 lust keep its old value (before concatenation with str2) so after the concatenation, str1 is a new object (unlike with mutable objects where in-place concatenation can be faster because we'd expect s0 to change as well)

I'd still prefer the += syntax because it's more concise and easier to grasp.

Jean-François Fabre
  • 137,073
  • 23
  • 153
  • 219
  • The VM can easily and legally optimize `x = x + y` into `x += y`, especially for primitives like most strings. Since strings are immutable (typically copy-on-write and may use some form of ropes), the bit about temporary objects is also misleading and a copy will often be made (or, depending on the VM, may never be made). – ssube Nov 21 '16 at 19:49
  • @ssube I thought that over and heavily edited my answer because I realized how it was highly incorrect in the javascript context. – Jean-François Fabre Nov 22 '16 at 12:16