How I got an LCP of 4.8s down to 1.3s
The full waterfall, what I cut, and what turned out not to matter.
The first thing I do on any speed job is stop guessing. Not the Lighthouse score — the network waterfall on a throttled 4G connection, on the actual product page people land on from ads. Scores move for reasons that have nothing to do with what a shopper feels.
On this store the largest contentful paint element was the product hero image, and it did not start downloading until 3.1 seconds in. Everything before that was render-blocking work the browser had to finish first.
What was in the way
- Three apps loading jQuery. Each one shipped its own copy, none of them checked whether it was already there.
- A 1.2MB hero image served as a PNG at 2400px wide, then scaled down in CSS.
- Fonts loading from three origins, with no preconnect and no swap, so text was invisible for a full second.
- A review widget in the head, synchronous, above everything the customer came to see.
The fix, in order of payoff
Image first. Shopify will serve WebP and the right size if you ask it to, and the hero is the one image worth preloading by hand:
<link rel="preload" as="image"
href="{{ product.featured_image | image_url: width: 900 }}"
fetchpriority="high">That alone took LCP from 4.8s to 2.6s. Then the scripts: the review widget moved to defer and only mounts when the reviews section scrolls into view, and two of the three jQuery copies went with the apps I replaced. Fonts got a preconnect, font-display: swap and a subset. 2.6s became 1.5s.
The last 200ms came from Cloudflare: a cache rule that serves collection pages from the edge for visitors without a cart cookie, so most first-time landings never touch the origin.
Two things I expected to matter did not: critical CSS inlining moved nothing measurable, and neither did switching the theme to a newer Dawn base.
What it was worth
Mobile conversion rate over the following month was up 34%. I would not claim all of that is speed — the cart drawer changed in the same release — but the bounce rate on paid landings dropped from 61% to 44%, and that one is hard to explain any other way.
If your store feels slow, start with the waterfall on a real device. The fix is usually four things, and three of them are images.