LCP and FID / INP & CLS

LCP(large content paint) measures how fast the main content of the page becomes visible to the user.

• we can compress images Preload critical images/assets and Reduce JS bundle size using SSR / SSG / edge caching.

• Good score: ≤ 2.5 seconds

FID / INP (First Input Delay / Interaction to Next Paint) : It measure how fast the page responds when a user interacts (click, tap, input).

• Reduce main-thread work by splitting JS bundles and deferring non-critical scripts.

• Good score: ≤ 100 ms
  

CLS( cumulative layout shift): It meassure how much the layout shifts unexpectedly.

• CLS Always define image dimensions Reserve space for dynamic content Use skeleton loaders Avoid inserting content above existing content

• good score: ≤ 0.1