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

发布于 2024-11-28 16:22:58 字数 254 浏览 0 评论 0原文

是否有 Web 开发人员功能/工具可以让我们知道浏览器进行回流的次数?

基本上我想得到某种反馈/信息。我不知道会怎样,但也许是某种显示时间线的性能图表(类似于 Google 的 速度追踪器),这样我就可以调查浏览器突然在某个时刻进行大量的回流,这样我就可以指出,嘿,这里是一个瓶颈,这里肯定存在错误/错误的实现或其他东西。

Is there a web developer functionality/tool that allows us to know how many times a browser is doing reflows?

basically I want to have some sort of feedback/information. I don't know how it will be, but perhaps some sort of performance graph that shows the timeline (akin to Google's Speed Tracer) so I can investigate when suddenly at a point the browser is doing an insane amount of reflows so I can point out hey here's a bottleneck, there got to be a bug/bad implementation of something here or something.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

鹤仙姿 2024-12-05 16:22:58
  1. Chrome 和 Safari 在 Web Inspector 中有“时间轴”选项卡,您可以在其中查看浏览器进行的所有回流和重绘。
  2. Firefox 有 MozAfterPaint 事件。它可以帮助您了解页面的哪些区域以及浏览器何时重新绘制。 Firebug Paint Events 插件在这里会很有帮助。它在 FireBug 控制台中显示重绘事件。
  1. Chrome and Safari have Timeline tab in Web Inspector where you can see all the reflows and redraws made by browser.
  2. Firefox has MozAfterPaint event. It can help you understand which regions of the page and when repainted by the browser. Firebug Paint Events add-on can be helpful here. It shows repaint events in FireBug console.
请别遗忘我 2024-12-05 16:22:58

如果您有定制的 Firefox,则可以跟踪回流信息。

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

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

You can track reflow information if you have a custom built Firefox.

see below:
https://developer.mozilla.org/en-US/docs/Debugging_Frame_Reflow

How to build Firefox with enable debugging mode:
https://developer.mozilla.org/en-US/docs/Developer_Guide/Build_Instructions

殤城〤 2024-12-05 16:22:58

2013 年末之后的某个时间,回流日志记录被内置到 Firefox 日志记录中。

https://mail.mozilla.org/pipermail/firefox-dev /2013年10月/001044.html

在浏览器控制台(工具 > Web 开发人员 > 浏览器控制台)的 [CSS] 菜单中,选择“日志”

Sometime after late 2013, the reflow logging is built into Firefox logging.

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

In browser console (Tools > Web Developer > Browser Console), in the [CSS] menu, select "Log"

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文