Navigation Timing API
官网地址：developer.mozilla.org/zh-CN/docs/…
Navigation Timing API 提供了可用于衡量一个网站性能的数据。与用于相同目的的其他基于 JavaScript 的机制不同，该 API 可以提供可以更有用和更准确的端到端延迟数据。
例如，想要知道一个网页的dom处理时间，我们就可以用domComplete时间减domLoading时间
这样这个页面的dom渲染时间就是2毫秒。
但是，window.performance.timing获得的是一个毫秒级的数据，前端发展到今天，完全可以用纳秒来计算加载时间，这样就可以用 PerformanceNavigationTiming提供的api进行计算，这样得到的数据更精确
获取domComplete方法就可以这样用：
FP(First Paint)
First Paint is the time between navigation and when the browser first renders pixels to the screen, rendering anything that is visually different from the default background color of the body. It is the first key moment in page load and will answer the question "Has the browser started to render the page?"
developer.mozilla.org/en-US/docs/…
浏览器请求一个资源，到这个资源刚开始渲染，这段时间
FCP(First contentful paint)
First Contentful Paint (FCP) is when the browser renders the first bit of content from the DOM, providing the first feedback to the user that the page is actually loading. The question "Is it happening?" is "yes" when the first contentful paint completes.
developer.mozilla.org/en-US/docs/…
浏览器渲染dom中第一位内容的时间，比如dom中的标签内容
LCP(LargestContentfulPaint)
The LargestContentfulPaint interface provides timing information about the largest image or text paint before user input on a web page
developer.mozilla.org/en-US/docs/…
渲染最大的图片或者文本资源所消耗的时间
FMP(First Meaningful Paint)
First Meaningful Paint (FMP) is the paint after which the biggest above-the-fold layout change has happened and web fonts have loaded. It is when the answer to "Is it useful?" becomes "yes", upon first meaningful paint completion.
developer.mozilla.org/en-US/docs/…
DCL(DOMContentLoaded)
The DOMContentLoaded event fires when the HTML document has been completely parsed, and all deferred scripts (<script defer src="…"> and <script type="module">) have downloaded and executed. It doesn't wait for other things like images, subframes, and async scripts to finish loading.
developer.mozilla.org/en-US/docs/…
dom解析完成后用的时间
L(load)
The load event is fired when the whole page has loaded, including all dependent resources such as stylesheets, scripts, iframes, and images. This is in contrast to DOMContentLoaded, which is fired as soon as the page DOM has been loaded, without waiting for resources to finish loading.
developer.mozilla.org/en-US/docs/…
dom解析完并渲染完成后的时间
前端名词解释：github.com/mdn/content…
