如何准确测量HTML5浏览器帧率（FPS）？ [英] How to accurately measure HTML5 Browser Framerates (FPS)?

问题描述

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

What is the most accurate way to measure framerates, i.e. FPS, in modern HTML5 browsers? I'm specifically interested in FPS for Canvas animations.

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

http://weblogs.mozillazine.org/roc/archives/2010/11/measuring_fps.html will tell you that trying to measure framerate by counting how often your setTimeout runs is not accurate. The browser can run your Timeout callback multiple times between screen paints.

结果Mozilla有一个window.mozPaintCount https://developer.mozilla.org/en/DOM/window.mozPaintCount ，它们应提供准确的FPS。

Turns out Mozilla has a window.mozPaintCount https://developer.mozilla.org/en/DOM/window.mozPaintCount available, which should provide an accurate FPS. However, this only works for Mozilla.

Chrome的开放问题类似： http://code.google.com/p/chromium/issues/detail?id=65348

There's an open issue for Chrome for something similar: http://code.google.com/p/chromium/issues/detail?id=65348

在Chrome中手动检查硬件加速FPS的方法是抓取Chrome测试版频道（截至发布日期），然后转到about：flags并打开FPS计数器。但是，在Mac上，加速只在使用WebGL时打开。因此，无法在Chrome for Mac上检查FPS for Canvas。

A manual way to check for hardware accelerated FPS in Chrome is to grab the Chrome Beta channel (as of posting date) and go to about:flags and turn on FPS Counter. However, on a Mac, acceleration only turns on when using WebGL. So, no way to check FPS for Canvas on Chrome for Mac.

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

What are other strategies for accurately measuring HTML5 FPS?

感谢！

推荐答案

请检查：

• https://github.com/mrdoob/stats.js - 这是最好的FPS监视器我知道。它还提供了一些有关mem / cpu使用情况的统计信息（您必须使用特殊参数运行浏览器以公开该数据），但也可能会受到您描述的不准确性的影响。

• https://github.com/mrdoob/stats.js - it's the best FPS monitor I know. It also gives you some stats about mem/cpu usage (you have to run your browser with special parameter to expose that data), but may also suffer from the inaccuracy you described.

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

此外，在新的chrome版本（可能是canary流）中，应该有一个选项，用于在 ：flags 。

Also, in new chrome builds (probably canary stream) there should be an option for displaying FPS in about:flags.

这篇关于如何准确测量HTML5浏览器帧率（FPS）？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！