在分析 jQuery 行代码时，是否包括渲染时间？

Question

假设我正在测量执行 jQuery 函数所花费的时间，例如：

<Start timer here>
$("#myImage").hide();
<End timer here>

在该计时器代码中，它是否包括因调用该方法而发生的任何回流或重绘？或者这会在一段时间后发生（即消息被发布到队列然后稍后执行）？我如何测量 reflow/repaint 花费了多长时间？

Answer 1

根据 w3.org，performance.now 不包括在 repaints/on-screen 渲染上花费的时间。

NOTE:As the now method returns the current time, time spent while a document is hidden [Page Visibility] or not fully active [HTML5] is included for the purpose of this method - W3.org.

Answer 2

Javascript 执行通常不会阻塞回流。通常重绘或回流是排队的，然后浏览器在当前 JS 执行线程完成时处理所有排队的操作。这是因为在完成所有 JS 修改后进行一次布局比在每次更改后进行重新布局更有效。因此，通常在您的计时器期间不会发生布局。

您可以在 Javascript 中请求一些属性，这些属性依赖于准确布局的页面（尽管未绘制）并且请求这些属性可以强制在您的 JS 中间进行布局，这将显示在计时器上。请参阅 this article 以了解有关在 Javascript.

中间强制布局的一些详细信息

在分析 jQuery 行代码时，是否包括渲染时间？

When profiling lines of jQuery code, does it include rendering time?

javascript

jquery

profiling