Как точно измерить HTML5 Browser Framerates (FPS)?

Каков наиболее точный способ измерения кадров, т.е. FPS, в современных браузерах HTML5? Меня особенно интересует FPS для анимации Canvas.

http://weblogs.mozillazine.org/roc/archives/2010/11/measuring_fps.html расскажет вам, что пытаться измерить частоту кадров, подсчитывая, как часто выполняется setTimeout, неточно. Браузер может запускать ваш обратный вызов Timeout несколько раз между красками экрана.

Оказывается, Mozilla имеет доступ к окну .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 (начиная с даты публикации) и перейдите к: flags и включите счетчик FPS. Однако на Mac ускорение включается только при использовании WebGL. Таким образом, нет возможности проверить FPS для Canvas на Chrome для Mac.

Каковы другие стратегии точного измерения HTML5 FPS?

Спасибо!

Ответы

Ответ 1

Пожалуйста, проверьте:

  • https://github.com/mrdoob/stats.js - это лучший монитор FPS, который я знаю. Он также дает вам некоторые статистические данные об использовании mem/cpu (вы должны запускать свой браузер с помощью специального параметра, чтобы выставлять эти данные), но также могут страдать от неточности, которую вы описали.

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

Кроме того, в новых сборках chrome (возможно, канареечный поток) должна быть опция для отображения FPS в about:flags.