Are JavaScript strings immutable? Do I need a “string builder” in JavaScript?

They are immutable. However, I've always heard what Ash mentioned in his answer( that using Array.join is faster for concatenation) so I wanted to test out the different methods of concatenating strings and abstracting the fastest way into a StringBuilder. I wrote some tests to see if this is true (it isn't!).

This was what I believed would be the fastest way, though I kept thinking that adding a method call may make it slower...

function StringBuilder() {
  this._array = [];
  this._index = 0;
}

StringBuilder.prototype.append = function (str) {
    this._array[this._index] = str;
    this._index++;
}

StringBuilder.prototype.toString = function () {
  return this._array.join('');
}

Here are performance speed tests. All three of them create a gigantic string made up of concatenating "Hello diggity dog" one hundred thousand times into an empty string.

I've created three types of tests

• Using Array.push and Array.join
• Using Array indexing to avoid Array.push, then using Array.join
• Straight string concatenation

Then I created the same three tests by abstracting them into StringBuilderConcat, StringBuilderArrayPush and StringBuilderArrayIndex http://jsperf.com/string-concat-without-sringbuilder/5 Please go there and run tests so we can get a nice sample. Note that I fixed a small bug, so the data for the tests got wiped, I will update the table once there's enough performance data. Go to http://jsperf.com/string-concat-without-sringbuilder/5 for the old data table.

Here are some numbers from Feb 21, 2013, if you don't want to follow the link. The number on each test is in operations/second (higher is better)

| Browser          | Index | Push | Concat | SBIndex | SBPush | SBConcat |
---------------------------------------------------------------------------
| Chrome 24.0.1312 | 83    | 87   | 702    | 69      | 87     | 165      |
| Chrome 25.0.1364 | 43    | 47   | 620    | 42      | 42     | 68       |
| Firefox 10.0.10  | 164   | 164  | 533    | 164     | 16     | 421      |
| Firefox 19.0     | 70    | 70   | 259    | 70      | 70     | 186      |
| Exploder 7.0     | 51    | 33   | 58     | 31      | 37     | 45       |
| Exploder 8.0     | 48    | 30   | 58     | 30      | 36     | 36       |
| Exploder 9.0     | 87    | 64   | 95     | 61      | 61     | 61       |
| Opera 12.14      | 125   | 154  | 66     | 106     | 137    | 63       | 

Findings

• Nowadays, all browsers handle string concatenation well. Array.join only helps Opera

• Overall, Chrome is fastest, clocking 1025 ops/sec in 27.0. 10 times faster than using Array.join()

• Firefox is in second place at around 550 ops/sec (but 20.0 seems to have regressed). Array.join is about 4-5 times slower.

• IE is fastest with straight string concatenation, it's really slow using Array.join and Array.push. IE 9 makes Array.join not be so slow, and all the SB abstractions perform almost the same way (probably because of the method overhead)

• Opera is the only one where the Array.join actually helps, it's 2-3 times as fast as string concatenation.

• Creating a StringBuilder to abstract away each browser's performance issues does more harm than good. The overhead of method calls may be acceptable but the tendency seems to be that browsers are handling string concatenation more smartly. It would only make sense if your target audience is Opera, so you can use Array.join there and use String concatenation everywhere else (this means all the other browsers are taking a hit)

Hope somebody else finds this useful

Different Test Case

Since @RoyTinker thought that my test was flawed, I created a new case that doesn't create a big string by concatenating the same string, it uses a different character for each iteration. String concatenation still seemed faster or just as fast. Let's get those tests running.

I suggest everybody should keep thinking of other ways to test this, thanks for the input Roy.

http://jsperf.com/string-concat-without-sringbuilder/7

Performance tip:
If you have to concatenate large strings, put the string parts into an array and use the Array.Join() method to get the overall string. This can be many times faster for concatenating a large number of strings.

No StringBuilder in javascript.

JavaScript strings are indeed immutable.

Strings in Javascript are immutable

Regarding your question (in your comment to Ash's response) about the StringBuilder in ASP.NET Ajax the experts seem to disagree on this one.

Christian Wenz says in his book Programming ASP.NET AJAX (O'Reilly) that "this approach does not have any measurable effect on memory (in fact, the implementation seems to be a tick slower than the standard approach)."

On the other hand Gallo et al say in their book ASP.NET AJAX in Action (Manning) that "When the number of strings to concatenate is larger, the string builder becomes an essential object to avoid huge performance drops."

I guess you'd need to do your own benchmarking and results might differ between browsers, too. However, even if it doesn't improve performance it might still be considered "useful" for programmers who are used to coding with StringBuilders in languages like C# or Java.