Core Web Vitals remain a confirmed Google ranking signal, and in 2026 they double as an AEO signal: answer engines and AI crawlers deprioritize slow, unstable pages because they are expensive to fetch and render. The targets have not changed — LCP ≤ 2.5s, INP ≤ 200ms, CLS ≤ 0.1 at the 75th percentile — but the tactics that get you there reliably have matured.

This playbook distills what actually moves the needle across dozens of production builds, ordered by impact.

1. Fix LCP First — It Is Almost Always an Image or Font Problem

Largest Contentful Paint measures when the biggest above-the-fold element finishes rendering. In practice, the culprit is one of three things:

Images

Serve a pre-resized, modern-format hero image (WebP or AVIF) sized to the actual layout slot — not a 3000px original scaled down by CSS.
Add fetchpriority="high" and loading="eager" to the LCP image, and preload it when it is discoverable late (background images, CSS-referenced assets).
Never lazy-load the LCP image. loading="lazy" above the fold is the single most common self-inflicted LCP regression.

Fonts

Preload the primary variable font (.woff2, crossorigin) so text renders on the first paint instead of after a font round-trip.
Use font-display: swap with a metric-compatible fallback (size-adjust, ascent-override) to prevent layout shift when the real font arrives.

Render-blocking resources

Inline critical CSS or split stylesheets so above-the-fold rendering waits on kilobytes, not hundreds of kilobytes.
Defer every script that is not required for first paint. If a third-party tag manager can load after load, let it.

2. INP Is the Metric That Exposes JavaScript Debt

Interaction to Next Paint replaced FID in March 2024, and it measures the worst interaction responsiveness, not an average. Three levers fix it:

Reduce long tasks. Anything over 50ms blocks the main thread. Code-split routes, drop unused polyfills, and audit your bundle — most sites ship 30–50% of JavaScript they never execute on a given page.
Break up work. Wrap heavy handlers in scheduler.yield() (or setTimeout fallbacks) so the browser can paint between chunks.
Tame third-party scripts. Chat widgets, analytics, and embeds are the usual offenders. Load them lazily, after user intent or idle time, and measure their cost with the Long Tasks API.

A useful budget: keep total JavaScript under ~200KB compressed on marketing pages. Every framework can hit this; most default configurations do not.

3. CLS: Reserve Space Before the Browser Needs It

Cumulative Layout Shift is almost entirely a planning failure. The fix list is short and permanent:

Set explicit width/height (or aspect-ratio) on every image and video.
Reserve space for late-arriving content: ad slots, embeds, banners, cookie notices.
Never insert content above existing content after paint.
Animate only transform and opacity — properties that do not trigger layout.

4. Measure Like Production, Not Like a Lab

Lab tools (Lighthouse, PageSpeed Insights) are reproducible but optimistic. Field data is what Google and answer engines actually see.

CrUX is the source of truth. Check the Chrome User Experience Report data in PageSpeed Insights and Search Console for your real 75th-percentile numbers.
Add RUM early. The web-vitals JavaScript library is a few kilobytes and streams real-user LCP/INP/CLS into your analytics. Without it, you are optimizing blind between lab runs.
Segment by device. A score that is green on desktop and red on mobile is a red score. Most real users are on mid-range Android devices with throttled connections — test there, not on your development machine.

5. Keep It Green: Performance as a Process

Performance decays by default. Teams that stay green treat it as a pipeline, not a project:

Run Lighthouse CI on every pull request with budgets that fail the build on regression.
Track bundle size per route; review any growth over 10KB.
Re-audit quarterly, because third-party scripts and framework upgrades drift silently.

The Payoff

Fast sites convert better, rank better, and get cited more often by AI answer engines. On our own builds, moving a client site from a 60s to a 95+ PageSpeed score typically correlates with measurable gains in organic clicks and inquiry volume within one to two quarters.

Performance optimization is a core part of every SowonWeb build — see our web service overview or request a performance audit for your existing site.

The 2026 Web Performance Playbook — Core Web Vitals Without the Guesswork