首次有效绘制

首次有意义的绘制 (FMP) 是 Lighthouse 报告效果部分跟踪的六个指标之一。每个指标都会捕获页面加载速度的某个方面。

Lighthouse 会以秒为单位显示 FMP:

Lighthouse 首次有效渲染时间审核的屏幕截图

FMP 衡量的内容

FMP 用于衡量网页的主要内容何时对用户可见。FMP 的原始得分是指从用户发起网页加载到网页呈现主要的页首内容之间的时间(以秒为单位)。FMP 本质上显示的是绘制时间,之后会发生最大的上翻页布局更改。如需详细了解 FMP 的技术细节,请参阅 Google 的首次有效绘制时间:基于布局的方法

当网页上渲染的首个内容包含可见区域上的内容时,首次内容渲染 (FCP) 和 FMP 通常相同。不过,如果 iframe 中包含可见区域上方的内容,这些指标可能会有所不同。FMP 会在用户可见 iframe 中的内容时注册,而 FCP 包含 iframe 内容。

Lighthouse 如何确定您的 FMP 得分

与 FCP 一样,FMP 也基于 HTTP 归档中的真实网站性能数据

如果 FMP 和 FCP 相同,则其得分也相同。如果 FMP 发生在 FCP 之后(例如,网页包含 iframe 内容),则 FMP 得分将低于 FCP 得分。

例如,假设您的 FCP 为 1.5 秒,FMP 为 3 秒。FCP 得分为 99,但 FMP 得分为 75。

下表显示了如何解读 FMP 得分:

FMP 指标
(以秒为单位)
颜色编码 FMP 得分
(FCP HTTP 归档百分位)
0-2 绿色(快速) 75-100
2-4 橙色(中度) 50-74
4 人以上 红色(缓慢) 0 - 49

如何提高 FMP 得分

请参阅如何改进您网站上的 Largest Contentful Paint。用于改进 FMP 的策略与用于改进 Largest Contentful Paint 的策略基本相同。

在真实用户设备上跟踪 FMP

如需了解如何衡量 FMP 在用户设备上实际发生的时间,请参阅 Google 的以用户为中心的效果指标页面。“使用主推元素跟踪 FMP”部分介绍了如何以编程方式访问 FCP 数据并将其提交到 Google Analytics。

如需详细了解如何收集真实用户指标,请参阅 Google 的通过导航计时和资源计时评估实际加载性能。 借助“用户计时”标记和衡量 Lighthouse 审核,您可以在报告中查看“用户计时”数据。

如何提升总体效果得分

除非您有特定原因要重点关注某个指标,否则通常最好专注于提升整体效果得分。

使用 Lighthouse 报告的诊断部分,确定哪些改进对您的网页最有价值。优化建议的重要性越高,对效果得分的影响就越大。例如,以下 Lighthouse 屏幕截图显示,消除导致渲染阻塞的资源可带来最大的改进:

Lighthouse:显示多项审核及其影响的“诊断”部分
Lighthouse:诊断部分

请参阅性能审核,了解如何解决 Lighthouse 报告中指出的优化建议。

资源