First Contentful Paint

First Contentful Paint (FCP) is a timing-based metric that reports when the first content is rendered on screen. While FCP sounds similar to Largest Contentful Paint (LCP), but it’s not the same. FCP aims to measure when the first content appears, and LCP quantifies when the primary content appears.

Content, in FCP calculations, means:

  • <img>, <image> or <svg> elements (including background images set in CSS with background-image: url())
  • Non-white <canvas> elements
  • Text

How is First Contentful Paint calculated?

In Calibre, FCP is sourced directly from Chrome browser. The browser emits this timing as part of it’s tracing.

What First Contentful Paint measurement is fast?

Good FCP MeasurementPoor FCP Measurement
≤ 1.8s> 3s

Related Articles