前端网站性能指标

FP（First Paint）

页面在导航后首次呈现出不同于导航前内容的时间点。
通过浏览器的 window.performance.getEntriesByName(‘first-paint’)可以获取。

FCP（First Conentful Paint）

首次绘制任何文本，图像，非空白canvas或SVG的时间点。
通过浏览器的 window.performance.getEntriesByName(‘first-contentful-paint’)可以获取。

First Meaningful Paint（FMP）：

首次绘制页面“主要内容”的时间点。
FMP是由 Google 工程师引入的一种现代性能指标，它告诉我们页面何时‘有用’。其本质上是通过一种算法来猜测某个时间点可能是FMP。Chrome目前并没有公开获取 FMP 的 API，可以通过chrome的performance面板查看。

LCP(Largest Contentful Paint):

可视区域“内容”最大的可见元素开始出现在页面上的时间点。
谷歌没有API获取这个值，可以通过chrome的performance面板查看。

首次可交互指标

Time to Interactive（TTI）

可交互前的耗时，网页提供完整交互功能的时间，即网页在视觉上已全部渲染完毕且可以响应用户输入。
npm install tti-polyfill

import ttiPolyfill from ‘./path/to/tti-polyfill.js’;

ttiPolyfill.getFirstConsistentlyInteractive(opts).then((tti) => {
// Use tti value in some way.
});
TBT（Total Blocking Time）
页面总阻塞时长: TBT汇总所有加载过程中阻塞用户操作的时长，在FCP和TTI之间任何long task中阻塞部分都会被汇总.(超过50ms的Task都会被记录)