我应该使用requestanimationframe还是setTimeout？

Question

我在我的JavaScript应用程序中测试性能，这是一个使用canvas的游戏。我遇到的一个问题是FPS的主要波动：从ms到60秒。

正如您所看到的，有一些重大的峰值。这不是由于绘画，脚本，渲染或加载。我认为这是因为requestAnimationFrame没有分配设定的FPS费率而且可能过于灵活？我应该使用setTimeout吗？在这些情况下它通常更可靠，因为它会强制应用程序仅以一组FPS速率运行吗？

Answer 1

表现总是与细节有关。没有关于您的应用的更多信息（例如，呈现您的应用的特定代码）。很难说你应该如何构建你的代码。

通常，您应该始终使用requestAnimationFrame。 特别是用于渲染。

（可选）存储增量时间并将动画属性乘以该增量。当帧速率不一致时，这将创建平滑的动画。

我还发现随机帧率变化通常与垃圾收集有关。也许做一些内存分析，找出是否有地方可以避免每帧重建对象。

requestAnimationFrame几乎在所有方面都优于setTimeout。它不会作为背景选项卡运行。它节省了电池。它为浏览器提供了有关您正在开发的应用程序类型的更多信息，这使得给定的浏览器可以提高许多安全性能。

我强烈建议Nat Duca on browser performance观看此演讲。