chrome dev工具在哪里是“连续页面重新绘制”选项？

Question

在FPS Meter旁边的Render下面的开发工具中曾经有一个选项，表示“启用连续页面重新绘制”。现在它不在那里。它去了哪里？

版本60.0.3112.113（官方构建）（64位）

Answer 1

  

在FPS Meter旁边的Render下的开发工具中曾经有一个选项，表示＆＃34;启用连续页面重新绘制＆＃34;。现在它不存在了。它去了哪里？

它被删除了。请参阅Crbug issue #523040。

这里更广泛的问题是，您可以使用哪种工作流程来取代连续绘画模式（CPM）？

CPM在我之前，但看起来它给了你整个页面的绘画成本的实时估计。没有任何东西可以与之相提并论了，但是性能录制绝对可以帮助你衡量你的页面正在做多少绘画。一般的想法是开始录制，与您的页面交互，然后分析录制结果，以查看发生了多少绘画事件，以及每个人花了多少时间。请参阅Get Started With Analyzing Runtime Performance以熟悉“效果”面板。

2017年11月2日更新

Chrome 64中的DevTools（目前位于Canary）有一个新功能，它接近CPM称为Performance Monitor。它显示了FPS，每秒布局和每秒样式重新计算的实时视图。

Answer 2

＆＃34;连续页面重新粉刷＆＃34;很多版本之前已经从Chrome中删除了调试选项。但是，您仍然可以在开发人员工具的“性能”选项卡中绘制工具：

开发者工具 - ＆gt;表现 - ＆gt;设置 - ＆gt;启用高级油漆工具

这不会启用连续重绘，因为据我所知，Chrome不再这样做，但可以让您查看您的网页在录制过程中的实际工作情况，对于跟踪性能问题非常有用。它还与其他性能配置文件数据集成。

我个人发现这篇文章：https://blog.algolia.com/performant-web-animations/如果你正在制作动画，那么它很有用，但我不打算在这里总结它，因为它很长，我和＃39;我不确定你是否还要专门提高动画效果。 （与作者没有关联;只是有用的信息。）