我正在尝试构建一个平滑的60fps动画浏览器 JavaScript循环.我注意到,垃圾收集器踢入并将动态帧的变量非零时间添加到动画帧.我开始跟踪我的代码中的分配,然后隔离它自己的循环.我正在使用requestAnimationFrame,发现在一个所谓的“空”循环中,它仍然导致每次迭代的分配并触发垃圾收集器.令人沮丧的是,这似乎也在其他循环机制setInterval和setTimeout中发生.

下面我把一些jsfiddles和截图展示了示例’空循环’.所有样品均为〜5秒钟.

在这一点上,我正在寻找最佳的解决方案来最大限度地减少垃圾收集.从下面的示例来看,requestAnimationFrame在这方面是最糟糕的选择.

requestAnimationFrame

https://jsfiddle.net/kevzettler/e8stfjx9/

var frame = function(){
    window.requestAnimationFrame(frame);
};

window.requestAnimationFrame(frame);

的setInterval

https://jsfiddle.net/kevzettler/p5LbL1am/

var frame = function(){
   //literally nothing
};

window.setInterval(frame,0);

的setTimeout

https://jsfiddle.net/kevzettler/9gcs6gqp/

var frame = function(){
    window.setTimeout(frame,0);
}

window.setTimeout(frame,0);