数组调整大小性能，设置长度属性与重复推送

Question

所以我对以下代码进行了基准测试，试图找出哪个会更高效：

'use strict';

function addSetToArrayA(array, set) {
  for (const v of set) {
    array.push(v);
  }
}
function addSetToArrayB(array, set) {
  const origLength = array.length;
  const newLength = array.length + set.size;
  array.length = newLength;
  array[newLength - 1] = 0;
  let i = origLength;
  for (const v of set) {
    array[i++] = v;
  }
}

const set = new Set([1, 2, 3, 4, 5, 6]);

console.time('addSetToArrayA');
for (let i = 0;i<0xffffff;++i) {
  const base = [1, 2, 3, 4, 5, 6];
  addSetToArrayA(base, set);
}
console.timeEnd('addSetToArrayA');

console.time('addSetToArrayB');
for (let i = 0;i<0xffffff;++i) {
  const base = [1, 2, 3, 4, 5, 6];
  addSetToArrayB(base, set);
}
console.timeEnd('addSetToArrayB');

结果让我有点惊讶：

addSetToArrayA: 728.773ms
addSetToArrayB: 3296.437ms

所以我做了另一个基准测试：

'use strict';

const iters = 0xfffff;

console.time('32 push');
for (let i = 0;i<iters;++i) {
  const base = [1, 2, 3, 4, 5, 6];
  for (let k = 0;k<32;++k) {
    base.push(undefined);
  }
}
console.timeEnd('32 push');

console.time('32 length');
for (let i = 0;i<iters;++i) {
  const base = [1, 2, 3, 4, 5, 6];
  base.length = 32;
}
console.timeEnd('32 length');

console.time('64 push');
for (let i = 0;i<iters;++i) {
  const base = [1, 2, 3, 4, 5, 6];
  for (let k = 0;k<64;++k) {
    base.push(undefined);
  }
}
console.timeEnd('64 push');

console.time('64 length');
for (let i = 0;i<iters;++i) {
  const base = [1, 2, 3, 4, 5, 6];
  base.length = 64;
}
console.timeEnd('64 length');

console.time('128 push');
for (let i = 0;i<iters;++i) {
  const base = [1, 2, 3, 4, 5, 6];
  for (let k = 0;k<128;++k) {
    base.push(undefined);
  }
}
console.timeEnd('128 push');

console.time('128 length');
for (let i = 0;i<iters;++i) {
  const base = [1, 2, 3, 4, 5, 6];
  base.length = 128;
}
console.timeEnd('128 length');

结果与我之前的经历一致：

32 push: 132.061ms
32 length: 180.745ms
64 push: 284.575ms
64 length: 212.465ms
128 push: 586.747ms
128 length: 268.689ms

例如。对于相对较小的数组，重新调整大小 via.length比重复使用慢.push()，而对于较大的数组，它更快（如预期）。

使用.length = ...vs.时，V8 是否执行不同类型的数组大小调整.push(...)？这与 V8 处理稀疏数组的方式有关吗？

在 Node@10.12 上运行，在 chrome 中具有类似的结果。

Answer 1

V8 开发人员在这里。简短的回答是它.push()是超级优化的，而写入.length是一个相当慢的操作（部分是因为 JavaScript 规范说它必须做什么，部分是因为我们没有对其进行太多优化——但即使我们做了，它不会像.push()几个元素一样快）。

事实上，您会注意到写入.length以缩短数组和调用.pop()几次之间的类似差异。

我个人认为这不是一个糟糕的状态：您.push的代码简洁、直观且可读。该.length基替代好像是一个企图在使代码丑陋，更复杂的成本来挤出一点额外的性能-是不是很高兴，这确实不是帮助？写出你想写的代码，让引擎操之过急！:-)

使用 .length = ... 与 .push(...) 时，V8 是否执行不同类型的数组大小调整？

写入.length和调用.push(...)是非常不同的操作（后者非常简单，前者必须执行一堆检查），所以是的，V8 在幕后所做的肯定是不同的。调整大小本身（如果/一旦发生）是相同的。

这与 V8 处理稀疏数组的方式有关吗？

不在你的例子中。通常，写入.length必须检查数组是否应转换为稀疏模式，但该检查本身非常快。