快速替换图像src时Firefox中的内存使用情况

Question

我正在尝试使用Javascript实现动画PNG，每100毫秒替换一个图像的src。它显示正常，但我发现它在Firefox上运行时会逐渐消耗越来越多的内存。

这是我用来播放动画的循环，虽然我觉得它没什么了不起的 -

self.next = function() {
    if(self.doPlay == true) {
        self.currentFrame++;
        if(self.currentFrame >= self.numFrames) {
            self.currentFrame = 0;
            self.doPlay = self.doLoop;
        }
    }
    if(self.doPlay == true) {
        image.src = self.frames[self.currentFrame].src;
        setTimeout( self.next, self.frameDelays[self.currentFrame]);
    }
}

（其中frames是预加载的Image对象的数组）

如果我注释掉src中的更改，内存使用情况就好了。否则，内存使用率会无限攀升，直到浏览器最终崩溃。

我尝试从DOM中删除并替换图像，而不是更改src（在vanilla和jQuery中），但它似乎没有帮助。

任何人都知道更好的方法吗？

感谢您的时间：）

Answer 1

您曾考虑过仅使用图片并更改背景中的滚动条吗？ 它非常快且推荐

看这个

http://willian.nerdti.com.br/botaoImagem.html

Answer 2

这不是这个问题的答案，而是另一个评论（我不能离开，因为我的StackOverflow声誉目前不是50）。无论如何，我注意到上面的人（在评论部分）说这是一个非常糟糕的主意。对于这种特殊情况，他可能是对的，但是这种内存泄漏已经在我们的应用程序中以一种非常意想不到的方式提升了它（并且导致我们放弃了FireFox）。

基本上，我们的应用程序有一个左侧导航栏，其中包含组织中不同人员的小型化身。这个左侧导航栏可以被过滤，排序，更新等。这个栏可以（有时）包含数百个图像，每次随机播放这个栏，FireFox会丢失500K到1MB的剪辑，而IE9 / 10，Chrome和Safari不会丢失任何东西。

因此，在修复此错误之前，FireFox（对于我们的内部应用程序）不再是可行的选择。