Cutting LCP from 4.1s to 1.8s on a 12-year-old Shopify store

The customer is a midwest outdoor-apparel brand running on Shopify Plus since 2014. Annual revenue around $30M, 280 third-party scripts in production, an LCP element that hadn't improved since the iPhone 6. Their performance team had a budget for a re-platform but was understandably nervous about migrating an SEO-optimized catalog of 14,000 products.

Instead, they handed us a copy of their CrUX dashboard, a shopify-cli admin token, and one Tuesday afternoon. Here's what happened.

The starting point

Their p75 LCP across mobile, measured by Chrome User Experience Report, sat at 4.1 seconds. That's halfway between "needs improvement" and "poor" — and crucially, below the Google Core Web Vitals threshold their SEO consultant kept underlining in red ink.

What we changed

We did four things, in this order, with a brief Slack stand-up after each step to confirm nothing broke.

1. Put Booster in front. First, we pointed their apex CNAME at zn-7c3.thebooster.cloud. Within 90 seconds, Booster was answering at the edge. We enabled the default cache profile (Shopify Liquid pages cached for 60 seconds, assets indefinitely with content-hash). Median TTFB dropped from 380ms to 41ms at the same instant.

2. Turned on image rewriting. Their hero image was a 312 KB JPEG. Booster automatically rewrote it to a <picture> with AVIF (94 KB), WebP (118 KB), and JPEG fallback. AVIF support on modern mobile browsers is around 96% — almost everyone got the small payload.

3. Audited the script loader. Shopify themes load third-party scripts via the script_tag Liquid filter, but a previous freelancer had added a redundant <script src> tag inside the layout template. Eleven analytics scripts were loading twice. We patched the theme.

4. The font. This is the one that surprised everyone. Their LCP element was a heading using a custom font hosted on a vendor CDN. The font file was 184 KB and was loaded with font-display: block. That meant the browser refused to paint the LCP element until the font arrived — which took up to 1.4 seconds on flaky mobile networks.

<link rel="preload" href="/fonts/heading.woff2" as="font"
      type="font/woff2" crossorigin>
<style>
  @font-face {
    font-family: 'Heading';
    src: url('/fonts/heading.woff2') format('woff2');
    font-display: swap;
  }
</style>

What we didn't change

We didn't migrate Shopify. We didn't rewrite the theme. We didn't replace a single line of business logic. The only files that changed lived in the theme: one Liquid include and one stylesheet. Everything else came from Booster's defaults plus the image and font tweaks.

Why it generalizes

The 4.1s → 1.8s improvement reads as dramatic, but it's the median outcome for a store on this profile. The mistakes that mattered (duplicated scripts, blocking font-display) sit in nearly every legacy storefront we audit. The edge layer handles cache and image rewriting transparently; the human work is opening dev tools, finding the LCP element, and looking at what's blocking its paint.

If you want to try the same audit on your own store, the Booster free tier covers 5M requests per month — enough for any independent merchant to validate the upside before committing to a paid plan.