显示 JS 和 CSS3 动画的 FPS 的 JS
JS that shows FPS for JS and CSS3 animations
我正在进行一系列测试（小型研究）以了解使用 JS 为对象设置动画或使用 JS CSS3 设置动画之间的流体动画（通过测量每秒帧数）的差异。
我已经找到了一些在JS中获取FPS计数器（meter）的解决方案，但是我每次调用渲染函数时都需要调用它。如果动画仅在 javascript 部分完成，那就没问题了。如果我决定从使用 JS 动画转向 CSS3，据我所知，没有办法检测该事务的速度。
我知道对于 webkit 浏览器（在 Chrome 中测试过）我可以通过开发者工具获得这些信息，但是因为我也会在其他平台上进行测试，所以我正在寻找一个通用的解决方案。
任何想法、建议，任何能给我指明正确方向的东西，我们都将不胜感激。谢谢。
所以我找到了解决方案。它叫做 FPSMeter，由 David Corvoysier 开发。您可以找到图书馆和更多相关信息 here.
基本上他想到了一个好主意，只需在页面正文中附加 1 CSS 个动画元素。然后他使用转换来为该元素设置动画，并在每个 requestAnimationFrame 上尝试计算该元素的计算位置。然后他每一秒都简单地计算元素占据的不同位置的数量。基于此，他获得了 FPS。
我正在进行一系列测试（小型研究）以了解使用 JS 为对象设置动画或使用 JS CSS3 设置动画之间的流体动画（通过测量每秒帧数）的差异。
我已经找到了一些在JS中获取FPS计数器（meter）的解决方案，但是我每次调用渲染函数时都需要调用它。如果动画仅在 javascript 部分完成，那就没问题了。如果我决定从使用 JS 动画转向 CSS3，据我所知，没有办法检测该事务的速度。
我知道对于 webkit 浏览器（在 Chrome 中测试过）我可以通过开发者工具获得这些信息，但是因为我也会在其他平台上进行测试，所以我正在寻找一个通用的解决方案。
任何想法、建议，任何能给我指明正确方向的东西，我们都将不胜感激。谢谢。
所以我找到了解决方案。它叫做 FPSMeter，由 David Corvoysier 开发。您可以找到图书馆和更多相关信息 here.
基本上他想到了一个好主意，只需在页面正文中附加 1 CSS 个动画元素。然后他使用转换来为该元素设置动画，并在每个 requestAnimationFrame 上尝试计算该元素的计算位置。然后他每一秒都简单地计算元素占据的不同位置的数量。基于此，他获得了 FPS。