如何准确测量HTML5浏览器帧率（FPS）？

Question

在现代HTML5浏览器中测量帧速率（即FPS）的最准确方法是什么？我对Canvas动画的FPS特别感兴趣。

http://weblogs.mozillazine.org/roc/archives/2010/11/measuring_fps.html会告诉你，试图通过计算setTimeout运行的频率不准确来测量帧速率。浏览器可以在屏幕颜色之间多次运行您的Timeout回调。

原来Mozilla有一个window.mozPaintCount https://developer.mozilla.org/en/DOM/window.mozPaintCount可用，这应该提供准确的FPS。但是，这只适用于Mozilla。

有一个悬而未决的问题为Chrome类似的东西：http://code.google.com/p/chromium/issues/detail?id=65348

手动的方法来检查硬件加速FPS在Chrome是抢在Chrome Beta渠道（如发布日期），然后转到有关：标志和打开FPS计数器。但是，在Mac上，加速只在使用WebGL时打开。因此，无法在Mac版Chrome上检查Canvas的FPS。

什么是精确测量HTML5 FPS其他策略？

谢谢！

Answer 1

请检查：

• https://github.com/mrdoob/stats.js - 这是最好的FPS显示器我知道。它还为您提供有关MEM/CPU使用率（你需要运行特定参数浏览器公开数据）的一些统计数据，也可以从你描述的偏差的影响。

• https://github.com/pcwalton/firefox-framerate-monitor

此外，在新的镀铬构建（可能金丝雀流）应该有在about:flags显示FPS的选项。