Shopify Core Web Vitals: the fixes that actually move LCP

Every slow Shopify store we audit has the same shape: a decent theme buried under scripts. The fixes below are ranked by the impact we measure across client stores, and the first two are subtraction, which is the cheapest engineering there is.

Start with the script inventory

Open the network panel on a throttled connection and list every third party request before your Largest Contentful Paint element finishes. The typical inventory: three analytics tags, a chat widget loading eagerly, a review app shipping its own jQuery, a social pixel, a personalization script and a page builder wrapper.

Classify each one: needed, lazy or gone. Analytics can wait until after interaction. Chat can load on idle or intent. The review app's jQuery is usually replaceable with its modern build or a theme native approach. The page builder wrapper is a longer conversation, but the answer is usually migration to native sections.

Removing blocking scripts does not require a rebuild. On one recent store, script subtraction alone moved LCP from 4.1 seconds to 2.6 before we touched a line of theme code.

Treat the hero image like it matters, because it is the metric

LCP is usually the hero image or the product gallery's first frame. The discipline is boring and effective:

• Serve AVIF or WebP with a JPEG fallback
• Set explicit width and height so layout never shifts
• Preload exactly one image, the LCP candidate, and lazy load everything else
• Size the hero for the device that views it, with a sensible sizes attribute

On product pages, preload the first gallery image and nothing else. Collection pages should lazy load everything below the fold row.

Fonts: subset, swap, stop self hosting from CDNs

Load one variable font with display: swap and a weight range you actually use. Subset to the languages you sell in. If you are loading a font from a third party CDN, self host it: one fewer DNS lookup, one fewer request before render.

Two families maximum. If the design calls for three, the design is calling for a slower store.

Rebuild the heavy sections as Liquid islands

App blocks that render marketing sections via JavaScript are the modern version of the jQuery problem. The theme's native sections render server side. Where a section genuinely needs interactivity, hydrate an island: a gallery, a cart drawer, a picker. Do not hydrate the page.

Measure on real devices

Lab numbers lie flatteringly. The fixes above were validated on a mid range Android over throttled 4G, which is what the 75th percentile of your traffic actually experiences. Lighthouse mobile is a smoke test; field data is the truth.

Our current benchmark across theme rebuilds is a median LCP reduction of 38 percent, and most of that comes from the subtraction work above, not from clever code. Verify the current sample in content/site.ts before quoting it externally, then fix the next biggest script you find.