First Contentful Paint 首次内容绘制 (FCP)

首次内容绘制 (FCP) 是测量 感知加载速度 的一个以用户为中心的重要指标,因为该项指标会在用户首次在屏幕上看到任何内容时,在页面加载时间轴中标记出相应的点,迅捷的 FCP 有助于让用户确信某些事情正在进行。

1. 什么是 FCP?

首次内容绘制 (FCP) 指标测量页面从开始加载到页面内容的任何部分在屏幕上完成渲染的时间。对于该指标,”内容”指的是文本、图像(包括背景图像)、<svg>元素或非白色的<canvas>元素。

First Contentful Paint 首次内容绘制 (FCP)

在上方的加载时间轴中,FCP 发生在第二帧,因为那是首批文本和图像元素在屏幕上完成渲染的时间点。

你会注意到,虽然部分内容已完成渲染,但并非所有内容都已经完成渲染。

这是首次内容绘制 (FCP) 与* Largest Contentful Paint 最大内容绘制 (LCP)*(旨在测量页面的主要内容何时完成加载)之间的重要区别。

 

First Contentful Paint 首次内容绘制 (FCP)怎样算是良好的 FCP 分数?

为了提供良好的用户体验,网站应该努力将首次内容绘制控制在 1.8 秒或以内 。为了确保您能够在大部分用户的访问期间达成建议目标值,一个良好的测量阈值为页面加载的第 75 个百分位数,且该阈值同时适用于移动和桌面设备。

•  – 在 0 秒到 1.8 秒之间

• 需要改进– 在 1.8 秒到 3 秒之间

• – 超过 3 秒

2.如何测量 FCP

FCP 可以进行 实验室测量 或 实际测量,并且可以在以下工具中使用:

实测工具

实验室工具

3.如何改进 FCP

先通过工具检测网站的 lighthouse(灯塔)评分 FCP,您可以运行一次灯塔性能审计,并查看诊断建议的各种建议。

FCP 改善的常见方式(针对任何网站),请参阅以下性能指南:

给TA打赏
共{{data.count}}人
人已打赏
Google Analytics

UTM 标记综合指南 – Google Analytics

2023-9-16 18:37:56

技术SEO

网站核心指标Core web vitals(LCP、FID、CLS)是什么?

2023-7-16 23:36:38

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
有新私信 私信列表
搜索