javascript - 将元素添加到 Uint8ClampedArray 类型数组的快速方法

Question

正在进行一些像素操作，需要加速将元素添加到数组中的算法。现在我正在丢弃算法期间像素来自的类型化数组。有没有一种快速的方法可以将元素添加到 typedArray 中，如果没有，您是否看到可以对我当前的算法进行任何改进？

我当前的算法如下所示(简化并使用indexesToAdd升序):

//Example input and output
//indexesToAdd = [0,3,4]; // Normally around 4000 elements
//typedArray = [100,200,40,50,100]; // Normally around 1 million elements
//Output = [100,0,200,40,50,0,100,0];
function addIndexes(indexesToAdd, typedArray) {
  var newArray = [];
  var index = 0;

  for(var i=0;i<typedArray.length;i++) {
    if (i != indexesToAdd[index]) {
      newArray.push(typedArray[i]);
    } else {
      newArray.push(typedArray[i], 0);
      index++;
    }
  }

  return newArray;
}

我想过使用 splice 但 Uint8ClampedArray 没有这个能力。我还尝试将 Uint8ClampedArray 转换为常规数组，以便我可以使用拼接，但此转换过程的长度是算法的 10 倍。

Answer 1

考虑以下因素:

• 构造一个 Uint8ClampedArray TypedArray 而不是标准数组 ─ 这会降低内存消耗并加快写入速度
• 删除行重复项和不必要的 else block
• 预填充最大迭代
• 使用严格比较

尝试此代码，运行速度提高 7-10 倍(15 毫秒 vs 105 毫秒 ─ 100 万个项目):

function addIndexes(indexesToAdd, typedArray) {
  var newArray = new Uint8ClampedArray(indexesToAdd.length + typedArray.length);
  var index = 0;
  var max = typedArray.length;
  var c = 0;
  for(var i=0;i<max;i++) {
    newArray[c] = typedArray[i];
    if (i !== indexesToAdd[index]) {
      c++;
      newArray[c] = 0;
    }
    c++;
    index++;
  }
  return newArray;
}