javascript - 将许多新图像绘制到 Canvas 时内存泄漏

Question

我写了一个“幻灯片放映”，可以按顺序快速显示图像，很像停帧电影。

图像显示后，我就不再使用它了，我想将其从内存中清除，以便为新图像腾出空间。但是，在 Activity Monitor 中监控 Google Chrome Helper 时，我看到内存持续稳定增加，直到浏览器崩溃。

我注意到了 a chrome garbage collection issue这是作为错误提交的，我想知道我是否遇到了这个问题？

否则，这是我根据 this post 尝试过的一个技巧示例让 Chrome 删除我的旧图像数据。

  function ClearChunk()
  {      
        imageSet1 = null; // garbage collect please?
        imageSet1 = [];
  }

  function LoadNewChunk()
  {
        for (i=start_of_chunk;i<end_of_chunk;i++)
        {
              imageSet1[i-start_of_chunk] = new Image();
              imageSet1[i-start_of_chunk].src = img[i]; 
        }
  }

这首先清除，然后在后台加载，同时显示另一组图像。当时这似乎是个好主意，但在我的机器上它仍然稳步攀升至大约 3Gb 并且......噢，Snap。

首先如何缓解这种猖獗的内存消耗？

任何对话或基于代码的反馈将不胜感激。

Answer 1

尝试只执行一个“new Image()”，然后重用它，而不是在循环中创建多个。这帮助我解决了同样的问题。