Javascript内存管理（requestAnimationFrame回调）

Question

我正试图从小行星上扯皮，但是我遇到了一个严重的内存管理问题。

我使用window.requestAnimationFrame为我的游戏提供框架，方法是使用“ gameloop”函数调用requestAnimationFrame并将其作为参数。 但是，我肯定做错了什么，因为我的游戏的内存使用量很大，导致频繁的垃圾回收和较差的性能（以及与之相关的典型的锯齿状的内存使用方式）。 我很确定，这个问题的原因是函数和回调的循环正在创建许多函数对象-可能是一些无害的语句，导致该函数被创建而不是被重用...可能是gameloop函数。 ..

我从这篇文章中得到了这个想法： https : //www.scirra.com/blog/76/how-to-write-low-garbage-real-time-javascript

这是上面写有我的代码的jsfiddle： http : //jsfiddle.net/LEqUr/ （将焦点对准窗口的空白区域使新的小行星出现）。 我知道我的某些东西是骆驼套，有些是用下划线表示的-对不起。

（我认为）这是代码中最相关的部分：

var gameLoop = function () {
    getSetStageSize(1, 1);
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    updateGameState();
    window.requestAnimFrame(gameLoop);
}

window.requestAnimFrame = (function () {
    return window.requestAnimationFrame || 
       window.webkitRequestAnimationFrame || 
       window.mozRequestAnimationFrame || 
       function (callback) {
               window.setTimeout(callback, 1000 / 60);
           };
})();

综上所述，我非常希望获得一些有关代码组织方式的反馈（它肯定可以使用某些工作），有关回调的一些信息，有关如何/何时在疯狂的嵌套回调中创建对象的信息以及任何其他有用的信息。您可能有的建议。

谢谢！

Answer 1

我对特定于动画的部分不太了解，但是可以稍微简化一下最后一部分。 您不需要IIFE，因为您无需声明任何局部变量。

window.requestAnimFrame = (
    window.requestAnimationFrame || 
    window.webkitRequestAnimationFrame || 
    window.mozRequestAnimationFrame || 
    function (callback) {
        window.setTimeout(callback, 1000 / 60);
    }
);

除此之外，您可能会考虑在后台使用setInterval而不是setTimeout进行编码。 使用setTimeout时，每帧的实际时间是超时后的（100/60），再加上代码处理该帧所花费的时间。 另一方面，setInterval更了解幕后的真实时钟，并将调整帧之间的超时以补偿处理时间。