How to Fix Core Web Vitals in Shopify (LCP, INP, CLS)
Shopify Core Web Vitals improvement workflow centres on three levers: theme choice (Dawn and similar 2.0 themes are CWV-tuned), app discipline (each app adds JS and CSS), and image handling. This guide covers the Shopify-specific unified CWV workflow. Drill down: CLS, speed.
Step-by-step: How to fix Core Web Vitals on Shopify
- Baseline LCP, INP, CLS. PageSpeed Insights on homepage, collection, product, cart. Mobile field data is what Google ranks on. Note where you stand vs targets (LCP <2.5s, INP <200ms, CLS <0.1).
- Audit theme age and architecture. Pre-2.0 themes (Debut, Brooklyn, Supply) are CWV-disadvantaged structurally. Dawn and other 2.0 themes (Sense, Studio, Crave, Symmetry) score CWV better. If on a pre-2.0 theme, migration is highest-leverage single change.
- Prune apps aggressively. Every Shopify app adds JS. Audit installed apps: which are essential? Most stores have 8-15 apps installed but use 4-6. Uninstall unused. For essential apps with CWV impact, look for lighter alternatives.
- Optimise images. Shopify auto-converts to WebP, applies responsive sizing, and serves from CDN. Verify it's working (view source — image URLs should include _500x or similar dimension suffixes). Compress further with apps like Crush.pics, Image Optimizer.
- Defer non-critical JS. Apps like Booster: Page Speed Optimizer or AVADA SEO can defer non-critical app scripts. Test carefully — deferring some checkout scripts breaks purchase flow. Test purchase end-to-end after enabling deferral.
- Fix cart drawer and overlay layout. Cart drawer, mini-cart, related products should overlay not shift. Audit CSS positioning.
- Monitor and iterate. Search Console Core Web Vitals report. Weekly review during fix programme; monthly thereafter. App updates regress CWV often.
Frequently Asked Questions
Does upgrading Shopify plan improve CWV?
Marginally. Shopify Plus has slightly better edge infrastructure (~50ms TTFB improvement). The bulk of CWV gains come from theme and app changes, not plan tier. Don't upgrade purely for performance — upgrade for features you need.
Which Shopify theme has the best CWV scores out of the box?
Dawn (free), Sense (free), and Studio (free) consistently score best in independent tests — typically LCP 1.8-2.2s, CLS <0.1 on demo content. Premium themes vary: Impact and Symmetry are strong; some heavy magazine themes are poor. Test before buying.
Why does my Shopify INP get worse with apps installed?
Apps inject JS that runs on every page (not just where needed). Some apps process events globally even when their feature isn't used. Audit which apps are JS-heavy via DevTools Performance tab; uninstall or replace heavy ones.
Are there CWV-specific Shopify apps?
Booster: Page Speed, Hyperspeed, Theme Scientist, Tinified by Crush.pics — all market themselves around speed. They mostly do: image compression, JS deferral, CSS minification. Useful but no substitute for theme and app discipline.
Will Cloudflare in front of Shopify improve CWV?
Yes for global audiences. Custom Cloudflare DNS pointing to Shopify allows Polish (image optimisation), HTTP/3, and edge caching of static assets. Setup is technical (Shopify-specific DNS pattern); benefit is real for international stores.