如何检测CSS动画的重绘率（fps）？

Question

我对CSS动画的流畅性很感兴趣。以下是一些额外的要点：

• 我主要关注移动设备（WebKit）上的性能，
• 如果可以在正常操作期间（真实用户执行真实任务时）收集数据将会非常有帮助。

- vbence

---

可能是重复的问题：http://stackoverflow.com/questions/5113245/instrument-webkit-to-provide-fps-information-for-css-animations - Yisela

Chrome桌面版在about:flags中有一个FPS计数器标志。尝试将about:flags或about:labs输入到Android浏览器的URL中；也许那里也能用。 - Gerben

@Gerben 谢谢，我试过了，但是在移动浏览器上都不起作用。我会尝试一个基于 window.computedStyle 的 setTimeout 版本。希望那时候问题还没有被关闭... :) - vbence

Answer 1

Chrome Beta for Android支持通过在chrome://flags中设置标志获取FPS。

- GroovyDotCom

Answer 2

负面答案：由于JS程序本身（因此测量数量）在高动画负载下会变慢，因此window.getComputedStyle将不会产生任何结果。

See: http://jsfiddle.net/9xQ5H/17/

- vbence