JS string concatenation [performance comparison]

1. ECMAScript strings are immutable, that is, their values cannot be changed, so what happens when you write the following code?
Js code

Copy the codeThe code is as follows:

var str = "Hello "; 
str += "world"; 

The steps to perform are as follows:
Create a string that stores "Hello"
Create a string that stores "world"
Create a string that stores the connection results
Copy the current content of str into the result
Copy "world" into the result
Update str so that it points to the result
Steps 2-6 are performed each time the string is connected, making this operation very resource-consuming. Imagine repeating this process hundreds or even thousands of times, how is it performing?
2. Then look at the following code to solve this embarrassment
Js code

Copy the codeThe code is as follows:

var arr = new Array; 
arr[0] = "Hello "; 
arr[1] = "world"; 
var str = (""); 

The steps to perform are as follows:
Create a string that stores the result
Copy each string to the appropriate location in the result
In this way, no matter how many strings the array needs to be introduced, because the connection operation will only occur when the join() method is called.
3. Do you think the operation is complicated?Can't the code reflect its intention exactly? So let's use the object solution to make it easier to understand, and use the StringBuffer class to encapsulate the function:
Js code

Copy the codeThe code is as follows:

function StringBuffer() { 
this._strs = new Array; 
} 
 = function (str) { 
this._strs.push(str); 
}; 
 = function() { 
this._strs.join(""); 
}; 

Okay, let’s experience it, how to manipulate strings now?
Js code

Copy the codeThe code is as follows:

var sb = new StringBuffer(); 
("Hello "); 
("world"); 
var result = (); 

4. It seems to be full of color, fragrance and taste, but what is the effect of eating it?
Js code

Copy the codeThe code is as follows:

var tStart = new Date(); 
var str = ""; 
for(var i=0;i<10000;i++) 
{ 
str += "text" 
} 
var tEnd = new Date(); 
("The original method plus sign splicing 10,000 strings Take time: "+(()-())+"seconds");
var oSB = new StringBuffer(); 
tStart = new Date(); 
for(var i=0;i<10000;i++) 
{ 
("text"); 
} 
var sRst = (); 
tEnd = new Date(); 
("<br/>StringBuffer splices 10,000 strings. Time spent: "+(()-())+"seconds");

Maybe you have guessed that StringBuffer is faster than +, how fast is it? My test results:
Js code
FF3.0.10
The original method plus sign splicing 10,000 strings Take time: 3 seconds
StringBuffer splices 10,000 strings. Time taken: 8 milliseconds
IE7
The original method plus sign splicing 10,000 strings Take time: 15 seconds
StringBuffer splices 10,000 strings. Time taken: 16 milliseconds
IE8
The original method plus sign splicing 10,000 strings Take time: 15 seconds
StringBuffer splices 10,000 strings. Time taken: 16 milliseconds
Chrome1.0.154.46
The original method plus sign splicing 10,000 strings Take time: 1 magnificent second
StringBuffer splices 10,000 strings. Time taken: 2 milliseconds
5. What's going on?
kindness? Eyes are blurred? Or are the test results posted incorrectly? still……?
Nothing wrong!
In November 2006, this book was published in "JavaScript Advanced Programming" on pages 84-85. It is the content above me, but my test results are completely opposite to it. Is there a technological change or...?
I think it's a lesson! A profound lesson! I don’t know what people who read this article will think.