我们如何调查浏览器进行回流的次数？

Question

是否有一个Web开发人员功能/工具可以让我们知道浏览器正在进行多次回流？

基本上我想要一些反馈/信息。我不知道它会是怎样的，但也许某种性能图表显示了时间轴（类似于谷歌的Speed Tracer）所以我可以调查什么时候突然之间浏览器正在做一些疯狂的回流所以我可以指出，嘿，这是一个瓶颈，必须在这里或某事上出现错误/错误的实现。

Answer 1

1. Chrome和Safari在Web Inspector中有“时间轴”标签，您可以在其中查看浏览器进行的所有重排和重绘。
2. Firefox有MozAfterPaint个事件。它可以帮助您了解页面的哪些区域以及何时重新绘制浏览器。 Firebug Paint Events add-on在这里可以提供帮助。它在FireBug控制台中显示重绘事件。

Answer 2

如果您有自定义的Firefox，则可以跟踪回流信息。

见下文： https://developer.mozilla.org/en-US/docs/Debugging_Frame_Reflow

如何使用启用调试模式构建Firefox： https://developer.mozilla.org/en-US/docs/Developer_Guide/Build_Instructions

Answer 3

2013年末之后的某个时候，reflow日志记录内置于Firefox日志记录中。

https://mail.mozilla.org/pipermail/firefox-dev/2013-October/001044.html

  

在浏览器控制台（工具＆gt; Web Developer＆gt;浏览器控制台）中，在[CSS]菜单中选择“日志”