title: How to accurately measure HTML5 Browser Framerates (FPS)?
body: <p>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.</p>
  
  <p><a href="http://weblogs.mozillazine.org/roc/archives/2010/11/measuring_fps.html" rel="noreferrer">http://weblogs.mozillazine.org/roc/archives/2010/11/measuring_fps.html</a> 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.</p>
  
  <p>Turns out Mozilla has a window.mozPaintCount <a href="https://developer.mozilla.org/en/DOM/window.mozPaintCount" rel="noreferrer">https://developer.mozilla.org/en/DOM/window.mozPaintCount</a> available, which should provide an accurate FPS.  However, this only works for Mozilla.</p>
  
  <p>There's an open issue for Chrome for something similar: <a href="http://code.google.com/p/chromium/issues/detail?id=65348" rel="noreferrer">http://code.google.com/p/chromium/issues/detail?id=65348</a></p>
  
  <p>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.</p>
  
  <p>What are other strategies for accurately measuring HTML5 FPS?</p>
  
  <p>Thanks!</p>