New case study: a headless storefront that cut LCP from 4.8 s to 1.1 sRead the case study

Hearthline Goods · 2025

Rebuilding a homewares storefront for mobile buyers

A themed storefront weighing 6.1 MB per product page became a headless Astro build that loads in just over a second on a mid-range phone, with a shorter checkout to match.

  • Astro
  • Shopify Storefront API
  • Edge caching

The problem

Hearthline sells ceramics, linen and lighting to a mostly mobile audience: 78% of sessions came from phones, many on patchy 4G. Their theme had grown by accretion over five years. A product page shipped 6.1 MB, including 41 third-party scripts from apps installed and forgotten. Field data put mobile LCP at 4.8 seconds and Interaction to Next Paint at 610 ms.

The cost showed up in the funnel. Mobile conversion sat at 0.9% against 2.6% on desktop, and 71% of mobile carts were abandoned before payment. The team had tried image compression plugins and a faster theme, gaining a few hundred milliseconds each time. They asked us whether a rebuild was worth it, and if so, how to do it without pausing a catalogue of 2,300 products.

Process

  1. 01

    Audit first, then a budget

    We spent the first two weeks removing things rather than building. Every script got an owner or a delete. Nineteen apps went, including three review widgets doing the same job. From the remaining requirements we set a budget in CI: 170 KB of JavaScript on product pages, LCP under 1.5 seconds on a throttled Moto G profile. Any pull request that broke it failed.

  2. 02

    Astro on the Storefront API

    We kept Shopify as the system of record and moved the front end to Astro, rendering product and collection pages statically and revalidating on webhook. Cart and variant pickers are small islands that hydrate on interaction. The trade-off: merchandisers lost the theme editor, so we built a content model in the CMS for banners and editorial blocks with live preview.

  3. 03

    A shorter path to payment

    Checkout stayed on Shopify for PCI reasons, but everything before it changed. We cut the cart drawer from three steps to one, added express wallets above the fold, and moved shipping estimates onto the product page using postcode lookup. Each change shipped behind a flag and ran as a two-week split test before we kept it.

01Product page on Astro: 1.04 MB total, 162 KB of JavaScript
02Field LCP over 90 days, p75 by device class
03One-step cart drawer with express wallets above the fold
04Static pages, webhook revalidation, Shopify as source of truth
05Shipping estimate by postcode, moved onto the product page

Outcome

The new storefront launched in week 14 with all 2,300 products, redirects for 11,000 legacy URLs and no dip in organic traffic. Ninety days later the field data held: mobile LCP at 1.1 seconds, INP at 120 ms. Mobile conversion rose from 0.9% to 1.6%, and the in-house team now ships merchandising changes without a developer.

1.1 s
mobile LCP, down from 4.8 s
+78%
mobile conversion rate
−83%
product page weight
We had been told a rebuild would take a year. Quarry Street did it in fourteen weeks, and the bit I did not expect was how easy it is for us to change things ourselves now.
Nadia OseiHead of E-commerce, Hearthline Goods
Live demo · Quarry Street— View template →