Shopify handles roughly 70% of the speed levers automatically — global CDN, SSL on by default1, auto-AVIF and WebP via the image pipeline, lazy-loaded below-fold images, and HTTP/2 on every store. The remaining 30% you own: hero image dimensions on the homepage (the single biggest LCP factor), app bloat (third-party apps that inject script tags), and on Hydrogen storefronts, the entire frontend stack. The 2026 changelog adds two relevant admin tools: app activity tracking (Mar 11, 2026)3 and per-app Extensions / Functions / Pixels visibility (Apr 1, 2026)4.
This hub covers what Shopify auto-handles, the three Core Web Vitals in 2026, and the levers that move the needle on Shopify-specific stores. Three leaves: LCP fixes, app bloat, and the WebP/AVIF image pipeline.
§01Automatic
What Shopify already handles for speed
Shopify's automatic performance surface is wider than most owners realise. SSL is on by default. Themes lazy-load below-fold images. The image pipeline auto-emits AVIF and WebP via Sharp 0.34+. The global CDN puts assets within edge distance of every buyer. HTTP/2 multiplexing is baked in. Theme.liquid auto-injects critical CSS on most modern themes. This means the standard speed-audit checklist most agencies run is half-done before you touch the store.
Shopify's SEO overview1 calls out SSL ("activated by default to boost security and rankings") and the auto-emitted schema and canonical infrastructure. The optimize-site doc2 documents the auto site-structure benefits, including the readable URL convention that compounds with crawl efficiency.
The honest scope of owner-controllable levers: hero image size, app discipline, custom CSS weight, third-party tag managers (GTM, Klaviyo, Hotjar) injected via theme.liquid. The three leaf articles in this hub cover the levers that actually move the needle.
§02CWV
LCP, INP, CLS — the 2026 Core Web Vitals
Three Core Web Vitals govern Google's page experience scoring in 2026. Largest Contentful Paint (LCP) measures how fast the largest visible element renders — on Shopify, almost always the homepage hero image or a hero product image on a PDP. Interaction to Next Paint (INP) measures the worst-case interaction latency across the page session — JavaScript-heavy theme apps wreck this. Cumulative Layout Shift (CLS) measures unexpected layout shifts during page load — late-loading hero images and font swaps cause it on Shopify.
Targets: LCP under 2.5s for good, under 4.0s for needs-improvement. INP under 200ms for good, under 500ms for needs-improvement. CLS under 0.1 for good, under 0.25 for needs-improvement. These are Google's published thresholds, not Shopify's. PageSpeed Insights (the public Google tool) and the Chrome User Experience Report (the underlying data) report all three.
The single biggest Shopify-specific finding from the May 2026 audits: LCP fails almost exclusively because of oversized hero images. INP fails almost exclusively because of accumulated app scripts. CLS fails almost exclusively because of fonts loading after the first paint. Three causes; three fixes.
§03LCP
LCP on Shopify themes — the hero image rule
The homepage hero image is the largest contentful paint element on roughly 80% of Shopify themes. The fix is mechanical: pick a hero asset under 1600px wide, use Shopify's image_url Liquid filter to emit responsive srcset, add fetchpriority='high' on the <img> tag, and preload the image in the head. Themes that ship hero sections via Section Everywhere usually need a theme code edit on the hero section's image block.
The leaf at /shopify-seo/lcp-shopify/ walks the exact Liquid pattern, the fetchpriority and preload code, and the alt-text rule that pairs with it (descriptive alt text on hero images compounds with LCP because the image is the LCP candidate AND a meaningful ranking signal).
§04Apps
App bloat — finding what slows your Shopify store
App bloat is the single most consistent INP killer on Shopify. Every installed app that injects a script into theme.liquid runs on every page load, even when the feature isn't being used. A typical mid-stage store has 12-18 apps installed; a typical 'slow' Shopify store has 25-40. The March 11, 2026 changelog shipped admin API activity tracking under Settings > Apps with 30-day activity counts, data-privacy view, and app permission history. The April 1, 2026 changelog added per-app visibility into Extensions, Functions, and Pixels.
The leaf at /shopify-seo/app-bloat/ walks the audit workflow: open Settings > Apps, sort by API activity, identify high-activity apps with no recent business value3, click into Extensions / Functions / Pixels4 per app to confirm the injection footprint, and uninstall in a development theme first to measure delta.
One subtle pattern: uninstalling an app on Shopify does not always remove its theme.liquid script tags. Some apps inject persistent code blocks that survive uninstall. After uninstalling, search theme.liquid for the app's namespace and prune orphan <script> tags by hand. The leaf walks the safe-edit sequence.
§05Formats
WebP, AVIF, and the Shopify image pipeline
Shopify's image pipeline auto-emits AVIF first, WebP second, original format third — as long as you use the image_url Liquid filter (or img_url in older themes). The pipeline is powered by Sharp 0.34+ as of 2026. AVIF is smaller than WebP at equivalent quality; WebP is smaller than JPEG. The catch: theme code that uses raw <img src=...> instead of {{ product.image | image_url: width: 800 }} loses the auto-format negotiation and ships the original file format to every browser.
The leaf at /shopify-seo/image-formats-webp-avif/ covers the image_url filter, the srcset pattern that doesn't double-load, and the rare cases where you need to override the auto-format negotiation (transparent PNGs that AVIF compresses poorly, animated GIFs, etc.).
§06Hydrogen
Hydrogen vs Liquid — the speed difference
Hydrogen is Shopify's React-based storefront framework for headless stores. The April 9, 2026 Hydrogen release updated to Storefront API 2026-04, mandated the Storefront API proxy, and enabled backend consent mode. The speed trade-off: Hydrogen gives you React-level interaction control (great for INP) but requires you to ship the LCP wins manually (no automatic image pipeline by default — you wire it in via @shopify/hydrogen's <Image> component). Liquid themes get the automatic LCP wins but the INP ceiling is whatever the theme + apps emit.
Per the April 2026 changelog5, the Hydrogen release mandates the Storefront API proxy — every Hydrogen store now routes Storefront API calls through Hydrogen's backend, which improves both security and TTFB. Backend consent mode in the same release moves consent enforcement server-side, removing a chunk of client JavaScript.
The article at /shopify-seo/hydrogen-seo/ in cluster 1K covers the broader Hydrogen SEO surface — where Shopify's auto-magic stops, and what you ship by hand. Read it after this hub if you're on Hydrogen.
§07Checklist
The Shopify speed checklist
Walk these in order. (1) PageSpeed Insights baseline on three URLs — homepage, hero collection, hero product. (2) Confirm auto-AVIF/WebP is firing via View Source. (3) Hero image resized to under 1600px and using image_url filter with fetchpriority='high'. (4) Settings > Apps audit — uninstall everything inactive. (5) theme.liquid orphan-script prune after uninstalls. (6) Re-run PageSpeed Insights. Most stores move LCP by 20-40% from steps 3-5 alone.
