性能指标
Last updated
Was this helpful?
Last updated
Was this helpful?
在开始深入了解性能监控之前，应该要关注以下几个问题：
“它正在运行吗？”
我的网页浏览开始了吗（服务器有回应，等等）？
“它有用吗？”
页面上是否有足够关键的内容使我能够理解？
“它可以使用了吗？”
我能不能和页面互动了呢？还是它依旧处于加载状态？
“用户体验良好吗？”
是否没有滚动卡顿、动画卡顿、无样式内容闪烁和缓慢的 Web 字体文件加载等问题出现，让我感到惊喜？
让我们想一想，哪些指标可以回答这些问题？
这个指标表示页面绘制的时间点，换句话说它表示当用户第一次看到白屏的时间点.
这是当用户看见一些“内容”元素被绘制在页面上的时间点。和白屏是不一样的，它可以是文本的首次出现，或者 SVG 的首次出现，或者 Canvas 的首次出现等等。
FCP 可以用来回答，“它运行了吗？”
FCP 事件在文本（正在等待字体文件加载的文本不计算在内）、图片、Canvas 等元素绘制期间就已经被触发了。因此，FP 和 FCP 的时间差异可能从几毫秒到几秒不等。这个差别甚至可以从上面的图片中看出来。这就是为什么用一个指标来表示真实的首次内容绘制是有价值的。
FMP 可以用来回答，“它有用吗？”
有意义的内容指什么？比如：
博客的标题和文本
搜索引擎的搜索文本
对于电子商务产品来说重要的图片
但是下面的内容则不属于有意义的内容：
下拉菜单或类似的东西
无样式内容闪烁（FOUC）
导航条或页面标题
如果主要内容很久都没有展示出来，可能是因为太多资源（图片、样式、字体、JavaScript）有较高的加载优先级，阻塞了 FMP
当页面看上去“接近”加载完成，但浏览器还没有执行完所有脚本文件的状态，比如此时还有异步脚本、link import 加载的样式表、字体文件、预加载/懒加载的图片文件。
简单来说，就是 DOMContentLoaded
这个时间也是用来回答问题 - 用户体验良好吗？
