Tool Hub

Web Vitals

Core Web Vitals (LCP/INP/CLS/FCP/TTFB) thresholds and improvement tips

LCP
Largest Contentful Paint
loading

Time until the largest visible content element (image, video, large text block) is rendered.

Thresholds

Good: โ‰ค 2.5 seconds
Needs improvement: โ‰ค 4 seconds
Poor: > 4 seconds

How to improve

  • Optimize hero images (modern formats, proper sizing, preload)
  • Reduce server response time (CDN, edge caching)
  • Eliminate render-blocking JS/CSS
  • Preload critical fonts; prefer system fonts for above-the-fold text
INP
Interaction to Next Paint
interactivity

Slowest-ish interaction latency observed during the page session (replaces FID since 2024).

Thresholds

Good: โ‰ค 200 ms
Needs improvement: โ‰ค 500 ms
Poor: > 500 ms

How to improve

  • Break up long tasks (>50ms) โ€” yield to main thread
  • Defer non-critical JS (input handlers > rendering)
  • Avoid heavy work in event handlers
  • Use CSS transitions instead of JS animation where possible
CLS
Cumulative Layout Shift
stability

Sum of all unexpected layout shifts during the lifetime of the page (unitless score).

Thresholds

Good: โ‰ค 0.1 score
Needs improvement: โ‰ค 0.25 score
Poor: > 0.25 score

How to improve

  • Always set explicit width/height on images and ads
  • Reserve space for embeds before they load
  • Avoid inserting content above existing content (banners, cookie prompts)
  • Use transform: translate() instead of layout-affecting properties for animations
FCP
First Contentful Paint
loading

Time until the first text or image is rendered (any DOM content).

Thresholds

Good: โ‰ค 1.8 seconds
Needs improvement: โ‰ค 3 seconds
Poor: > 3 seconds

How to improve

  • Reduce server response time
  • Eliminate render-blocking resources
  • Inline critical CSS
TTFB
Time to First Byte
loading

Time between request and first byte of the response (server + network).

Thresholds

Good: โ‰ค 800 ms
Needs improvement: โ‰ค 1800 ms
Poor: > 1800 ms

How to improve

  • CDN + edge caching
  • Optimize backend (DB queries, N+1 etc.)
  • Use HTTP/2 or HTTP/3
  • Reduce redirect chains

Verify outputs before using in production. No warranty โ€” see Terms.