javascript - 为什么第一次绘制发生在 HTML 开始下载之前？

Question

我正在使用 Navigation Timing API 收集数据。

具体来说，这四个指标:

// Time spent during redirection
var redirectTime = performance.timing.redirectEnd - performance.timing.redirectStart;

// DNS query time
var lookupDomainTime = performance.timing.domainLookupEnd - performance.timing.domainLookupStart;

// TCP connection time
var connectTime = performance.timing.connectEnd - performance.timing.connectStart;

// Time to first paint, in milliseconds.
var firstPaintTime = window.chrome.loadTimes().firstPaintTime * 1000 - performance.timing.navigationStart;

我经常发现 redirectTime + lookupDomainTime + connectTime > firstPaintTime。如果 Chrome 的第一次绘制指标是从 navigationStart 计算的，那么这意味着第一次绘制发生在任何 HTML 下载之前。这似乎是不可能的。

如果 firstPaintTime 不是从 window.performance.timing.navigationStart 计算的，那么它是从什么时候计算的？

Answer 1

这样做是为了让最后一页/标签的主题颜色或背景颜色保持不变，直到新页面找出它需要的颜色。

这可以防止从深色页面到深色页面的白色闪烁。

您可以在此处阅读有关去年对初始油漆所做更改的更多信息: https://bugs.chromium.org/p/chromium/issues/detail?id=470669票据和漏洞很多，因此您可能需要探索才能获得全貌。