author avatar

syedsibtain

Fri Sep 15 2023

There are a couple of performance metrics used to measure the loading and rendering speed of web pages.

1: First paint: It refers to the point in time when the browser starts rendering first pixels on screen. It does not needs to be recognisable. First Paint can include background colors or simple styling changes and doesn't guarantee that any content or text is visible yet.

2: First Contentful Paint (FCP): First Contentful Paint occurs when the browser renders the first piece of content from the DOM (Document Object Model). It can be text, an image, etc usually referring to something meaningful on the screen.

  1. First Meaningful Paint (FMP): It refers to the point where a user can identify and understand the content that is loading. Usually includes layout changes the the font are loaded as well. FMP is depreciated.

  2. Largest Contentful Paint (LCP): It measures the time it takes for the largest content element (such as an image, text block, or video) within the viewport to become fully visible and rendered on the user's screen. A webpage should have a LCP of 2.5 seconds or less.

  3. Speed Index: It simply refers to how quickly the visible content of a web page is painted or rendered during the loading process. It depends on size of the viewport (mobile/desktop). Lower the score, the better it is.