JavaScript字符串连接速度

Question

有人可以向我解释这个：

http://jsperf.com/string-concatenation-1/2

如果你很懒，我测试了A）vs B）：

A）

var innerHTML = "";

items.forEach(function(item) {
    innerHTML += item;
});

B）

var innerHTML = items.join("");

两个测试的items是相同的500个元素的字符串数组，每个字符串是随机的，长度在100到400个字符之间。

A）最终快10倍。这怎么可能 - 我一直认为使用join("")连接是一个优化技巧。我的测试有什么缺陷吗？

Answer 1

使用join("")是在IE6上组合大字符串以避免O(n**2)缓冲区副本的优化技巧。从来没有预料到组成小字符串会带来巨大的性能胜利，因为O(n**2)只能真正支配一个数组的开销n。

现代翻译通过使用“依赖字符串”来解决这个问题。有关依赖字符串的解释以及一些优点和缺点，请参阅此mozilla bug。

基本上，现代口译员知道许多不同类型的字符串：

1. 字符数组
2. 另一个字符串的切片（子字符串）
3. 两个其他字符串的串联

这使得连接和子串O（1）的代价有时会使一个子网状缓冲区过多，从而导致垃圾收集器效率低下或复杂化。

一些现代解释器已经开始尝试进一步将（1）分解为仅用于ASCII字符串的byte [] s，以及当字符串包含不能容纳为一个字节的UTF-16代码单元时的uint16s数组。但我不知道这个想法是否真的存在于任何翻译中。

Answer 2

这是@Mike Samuel所讲述的Lua编程语言explains the buffer overhead的作者。示例在Lua中，但JavaScript中的问题是相同的。