Question

我正在使用canvas进行一些动画，我正在使用requestAnimationFrame API

window.requestAnimFrame = (function(callback)
{
    return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame ||

    //Call the function for the next animation at 60 fps        
    function(callback) {window.setTimeout(callback, 1000 / 60);};
})();

在大多数我在网上看到的例子中，setTimeout设置为60 FPS。显然，我可以将其设置得更高，以获得更流畅的动画，但这将为用户带来性能成本。我只是想知道是否有人能指出一些关于我应该为画布动画设置这个或者最佳帧率的一些好信息？这也会根据某人使用的浏览器而有所不同吗？

Answer 1

60 fps连接到最常用的60 Hz屏幕刷新率。这就是你到处找到这个价值的原因。

要获得“最佳”是非常困难的。动画的平滑程度高度依赖于硬件和浏览器。一个简单的有向图（用D3和SVG可视化）在我的笔记本上使用Firefox口吃。在我的Chrome同事的Mac上，动画效果很好。（硬件几乎相同。）

我认为60 fps是最好的配置。由于屏幕的刷新率，可能没有使用120 fps。

做画布动画时最佳FPS是多少？

1 个答案: