showcase14

FCP VS DCL

你的疑问应该来自 First Contentful Paint (FCP) and DOMContentLoaded (DCL),首先得看一下这两个的定义: https://developers.google.com/web/tools/chrome-user-experience-report/#first-paint

First Contentful Paint

Defined by the Paint Timing API and available in Chrome M60+:

“First Contentful Paint reports the time when the browser first rendered any text, image (including background images), non-white canvas or SVG. This includes text with pending webfonts. This is the first time users could start consuming page content.”

DOMContentLoaded

Defined by the HTML specification:

“The DOMContentLoaded reports the time when the initial HTML document has been completely loaded and parsed, without waiting for stylesheets, images, and subframes to finish loading.” - MDN.