The First Contentful Paint (FCP) metric measures the time from when the page starts loading to when any part of the page’s content is rendered on the screen. For this metric,
content refers to text, images (including background images),
<svg> elements, or non-white
<canvas> elements. This includes text with pending web fonts. This is the first time users could start consuming page content.
How to interpret your FCP score is outlined in this table:
|FCP time (in seconds)||Result|
|0 – 1.8||Fast|
|1.8 – 3||Moderate|
How to fix it
- Ensure the custom font is loaded fast. Preload web fonts to improve loading speed. Use for example:
<link rel="preload" href="/assets/fonts/Inter.woff2" as="font" type="font/woff2" crossorigin/>
- Track FCP on real users’ devices. This rule should help you. Note that we send the report for this rule if the FCP time is above 1.8 seconds.
- Improve loading speed for images. See article: 8 tips to speed up image loading.
Best Practice, Performance, SiteLint