相关疑难解决方法(0)

Web检查器使用"框架"进行分析:在时间轴中没有任何内容时查找性能问题的原因

我刚刚观看了Google I/O会话Jank Busters:构建Performant Web Apps,其中发言者解释了如何在Chrome Web检查器时间轴中使用新的"框架"视图.

这是我在正在开发的页面上滚动时获得的示例录制:

开发工具

正如您所看到的,某些帧中存在巨大延迟但在时间线中没有任何明显原因(黄色"Timer Fired"事件之间存在较大差距).如何解决性能问题以便始终如一地提高帧速率?

performance google-chrome web-inspector google-chrome-devtools

12
推荐指数
2
解决办法
2927
查看次数

Chrome开发工具框架时间轴中的大"空闲"栏

我正在绘制一些形状(弧形,线条等)requestAnimationFrame.没有什么太花哨,但我注意到一些偶尔的动画片.我在Chrome开发工具中使用时间轴检查器进行了分析,并且每帧看到大量的空闲时间,其中一些将FPS降至60以下(见截图).是否有已知原因或解决方案?

有很多空闲时间的帧

javascript performance canvas google-chrome-devtools requestanimationframe

12
推荐指数
1
解决办法
3855
查看次数