首次内容绘制 (FCP) 是测量 感知加载速度 的一个以用户为中心的重要指标,因为该项指标会在用户首次在屏幕上看到任何内容时,在页面加载时间轴中标记出相应的点,迅捷的 FCP 有助于让用户确信某些事情正在进行。 |
1. 什么是 FCP?
首次内容绘制 (FCP) 指标测量页面从开始加载到页面内容的任何部分在屏幕上完成渲染的时间。对于该指标,”内容”指的是文本、图像(包括背景图像)、<svg>元素或非白色的<canvas>元素。
在上方的加载时间轴中,FCP 发生在第二帧,因为那是首批文本和图像元素在屏幕上完成渲染的时间点。
你会注意到,虽然部分内容已完成渲染,但并非所有内容都已经完成渲染。
这是首次内容绘制 (FCP) 与* Largest Contentful Paint 最大内容绘制 (LCP)*(旨在测量页面的主要内容何时完成加载)之间的重要区别。
怎样算是良好的 FCP 分数?
为了提供良好的用户体验,网站应该努力将首次内容绘制控制在 1.8 秒或以内 。为了确保您能够在大部分用户的访问期间达成建议目标值,一个良好的测量阈值为页面加载的第 75 个百分位数,且该阈值同时适用于移动和桌面设备。
• 好 – 在 0 秒到 1.8 秒之间
• 需要改进– 在 1.8 秒到 3 秒之间 • 差– 超过 3 秒 |
2.如何测量 FCP
FCP 可以进行 实验室测量 或 实际测量,并且可以在以下工具中使用:
实测工具
实验室工具
3.如何改进 FCP
先通过工具检测网站的 lighthouse(灯塔)评分 FCP,您可以运行一次灯塔性能审计,并查看诊断建议的各种建议。
FCP 改善的常见方式(针对任何网站),请参阅以下性能指南: