First Contentful Paint 首次内容绘制 (FCP)
FCP指标：从开始加载到页面内容的任意部分在屏幕上渲染出来的时间。就是首批文本和图像元素在屏幕上完成渲染的时间点。"内容"指的是文本、图像（包括背景图像）、<svg>元素或非白色的<canvas>元素。
在上方的加载中，FCP 发生在第二帧，因为那是首批文本和图像元素在屏幕上完成渲染的时间点。
虽然部分内容已完成渲染，但并非所有内容都已经完成渲染。这是首次内容绘制 (FCP) 与Largest Contentful Paint 最大内容绘制 (LCP) （旨在测量页面的主要内容何时完成加载）之间的重要区别。
网站应该努力将FCP控制在1.8 秒或以内。
web-vitals可以用来测量 FCP等。
PerformanceObserver
PerformanceObserver：性能监测对象。在浏览器的性能时间轴记录下一个新的 PerformanceEntry 的时候将会被通知 。它有三个方法：observe，disconnect，takeRecords。
function perf_observer(list, observer) {
// Process the "measure" event
}
var observer2 = new PerformanceObserver(perf_observer);
observer2.observe({entryTypes: ["measure","frame"，"paint","resource"]});
PerformanceEntry
PerformanceEntry是performance 时间列表中的单个 metric 数据。每一个 performance entry 都可以在应用运行过程中通过手动构建 mark或者measure生成。此外， Performance entries 在资源加载的时候，也会被动生成（例如图片、script、css 等资源加载）。
它有四个只读属性：name，entryType，startTime，duration，它有一个方法：toJSON。
entryType属性有这么几个：frame/navigation；resource；mark；measure；paint (first-paint or first-contentful-paint)
PerformanceEntry子类：PerformanceResourceTiming，可以检索和分析有关加载应用程序资源的详细网络计时数据，例如重定向开始 ( redirect start ) 和结束时间，获取开始 ( fetch start )，DNS 查找开始 ( DNS lookup start ) 和结束时间，响应开始 ( response start ) 和结束时间等；PerformancePaintTiming，是一个提供页面在构建过程中的“绘制”时间点信息的接口。“绘制”是指将渲染树转换为页面上像素的过程。PerformanceMark和PerformanceMeasure。
PerformanceResourceTiming子类：PerformanceNavigationTiming，此接口可用于确定加载或卸载文档需要多少时间。
Performance
Performance对象可以获取到当前页面中与性能相关的信息。它有一些方法，例如：mark，measure，now，getEntries（返回 PerformanceEntry 数组），getEntriesByType，getEntriesByName，clearMarks，clearMeasures等。
