的Javascript图像数据以多维数组的性能问题

Question

我写了一个方法，用于在画布图像数据阵列转换成一个多维坐标基于阵列像这样：

parse: function() { 
    var x = y = 0; 
    var step = 0; 
    for(var i = 0; i <= this.imageData.length - 4; i += 4) { 
     if(step == this.width) { 
      ++ y; 
      step = 0; 
     } 
     this.data[x][y] = [this.imageData[i], 
          this.imageData[i+1], 
          this.imageData[i+2], 
          this.imageData[i+3]]; 

     ++ x; 
     ++ step; 
    } 
} 

我已经测试了它在较小的规模（10×10图像），但是当我移动到一个更大的图像，在我的情况下800x800，它完全崩溃的浏览器（选项卡）。我可以理解为什么，但是，我想知道是否有更有效的方法来解决这个问题。

有什么想法？

Answer 1

你可以通过这样的取%（模数）运营商的优势，少做一些数学：

var floor = Math.floor; // store a reference to Math.floor, anything goes when you have 640,000 iterations 

parse: function(imageHeight, imageWidth) { 
    for(var i = 0; i < this.imageData.length; i++) { 
     this.data[i % imageWidth][Math.floor(i/imageHeight)] = [this.imageData[i], 
          this.imageData[i+1], 
          this.imageData[i+2], 
          this.imageData[i+3]]; 

    } 
}​ 

你必须拿出值imageHeight和imageWidth，当然。