Introduction

This article is for both Beginners and Experienced developers with Next.js.

 Prior experience with any sort of analytics is NOT Required.

An overview of the Web Vitals

Here is a quick overview of the web vitals,

Time to First Byte (TTFB): It refers to the time between the browser requesting a page and when it receives the first byte of information from the server.

First Contentful Paint (FCP): The time when the browser renders the first bit of content.

Largest Contentful Paint (LCP): It measures loading performance. For better user performance, LCP should occur within 2.5 seconds.

First Input Delay (FID): It measures interactivity. A better user experience should have a page FID of fewer than 100 milliseconds.

Cumulative Layout Shift (CLS): It measures visual stability. Pages should maintain a CLS of less than 0.1.

read full blog here