Core Web Vitals Explained: Hit PageSpeed 90+ in 30 Days

In 2026, Google uses Core Web Vitals as a ranking factor — sites that pass all 3 thresholds outrank sites that don’t, all else equal, in competitive markets.

Beyond rankings, Core Web Vitals correlate directly with conversion: every 1-second improvement in LCP lifts conversion 8-12%.

Core Web Vitals — The 3 Metrics

1. LCP (Largest Contentful Paint)

Measures when the main image or heading finishes loading.

Causes of slow LCP:

• Large images (5MB hero image)
• Slow server response (TTFB > 600ms)
• Render-blocking JS/CSS
• Slow-loading web fonts

2. CLS (Cumulative Layout Shift)

Measures how much the layout “shifts on its own” after loading.

Causes of high CLS:

• Images without specified width/height
• Ads/embeds that load late
• Web font swap that changes layout
• Dynamic content injection

3. INP (Interaction to Next Paint) — replaced FID in 2024

Measures how fast the page responds to a click or tap.

Causes of high INP:

• Heavy JavaScript blocking the main thread
• Many event listeners
• Slow third-party scripts (analytics, chat widget)

Free Tools for Measuring

1. PageSpeed Insights — quick test for a single page.
2. Web.dev Measure — Lighthouse in the browser.
3. Chrome DevTools Lighthouse — local test.
4. CrUX Report — real user data from Chrome.
5. Google Search Console → Core Web Vitals tab — real performance on your site.

Use GSC real data as your source of truth — that’s what Google uses for ranking.

Fixing Core Web Vitals — Priority Order

Priority 1: Image Optimization (fixes LCP)

This is the easiest, highest-impact fix.

Use WebP / AVIF:

• JPEG 2MB → WebP 200KB (90% smaller)
• AVIF 100KB (95% smaller)

Specify width/height:

<img src="hero.webp" width="1200" height="630" alt="...">

Lazy load non-hero images:

<img width="1376" height="768" loading="lazy" decoding="async" src="..." loading="lazy" alt="...">

Use modern image formats via CDN:

• Cloudflare Image / Imgix / Cloudinary

Priority 2: Reduce JavaScript (fixes LCP + INP)

Cut third-party scripts:

• Every tool (Hotjar, Intercom, chat widget) is a performance tax.
• Keep only what’s essential.

Defer non-critical JS:

<script src="..." defer></script>

Code splitting (modern stacks):

• Next.js / Astro handle this automatically.
• WordPress needs a plugin.

Priority 3: Server Response (fixes LCP)

Target TTFB under 600ms:

• Upgrade hosting (Shared → VPS/Cloud).
• Use a CDN (Cloudflare, CloudFront, Fastly).
• Enable caching (page cache + object cache).

For WordPress:

• Cloudflare APO + WP Rocket.
• Server-level cache (Nginx FastCGI).

For modern stacks (Astro / Next.js):

• Static generation or ISR.
• Deploy on Edge (Cloudflare Workers, Vercel Edge).

Priority 4: Reserve Space (fixes CLS)

Specify width/height on every image, video, and iframe.

Reserve space for ads:

.ad-slot {
  min-height: 250px; /* know the ad size in advance */
}

Avoid web font layout shift:

• Use font-display: optional or swap.
• Preload critical fonts.

Priority 5: Optimize Third-party (fixes INP)

Move heavy scripts to a Web Worker:

• Partytown library (Astro has an integration).

Replace heavy widgets:

• Disqus → Giscus (lighter, GitHub-based).
• Intercom → open-source alternative.

Which Site Types Are Hardest to Fix

WordPress + Page Builder (hardest)

• Elementor / Divi / WPBakery load heavy JS.
• Plugin hell — every plugin adds more JS.
• Typical ceiling: 75-85 Mobile PageSpeed.
• Real fix: change theme + cut plugins, or migrate to a modern stack.

Read WordPress Speed Optimization.

Custom WordPress Theme (mid)

• Depends on theme + cache plugin.
• Can reach 85-90+.
• Requires code-level optimization.

Modern Stack: Astro / Next.js (easiest)

• PageSpeed 90+ on Day 1 (default).
• No plugins needed.
• Static-first architecture.

Read WordPress vs Astro.

Real Case: Phuket Hotel

A Karon hotel, 2024:

• Before: Mobile 42, LCP 5.8s, CLS 0.34
• After WordPress → Astro migration: Mobile 96, LCP 1.4s, CLS 0.02 (3 weeks of work)
• Result: Direct Booking conversion up 28% within the first 60 days post-migration.

A 30-Day Fix Roadmap

Week 1: Audit (PageSpeed + GSC Core Web Vitals tab). Week 2: Image optimization (convert everything to WebP, add width/height). Week 3: JS optimization (defer non-critical, remove unused). Week 4: Hosting + cache (upgrade if needed).

After 30 days, expect Mobile PageSpeed to move 15-25 points.

Request a Performance Audit

If your site is Mobile PageSpeed under 60 and rankings are poor, request an audit — we benchmark and produce an action plan.

If you’ve decided to migrate to a modern stack, see Web Development.