Case study
Synchro
Cutting 1.5–3s off a landing page without touching the design
- Sector
- ecommerce
- Year
- 2025 — 2026
- Role
- Performance lead
- Live
- besynchro.com
- mobile load savedlanding page, measured field + lab
- 1.5–3s
- render-blocking CSS removedFontAwesome alone
- 80KB
- bottlenecks shippedfrom a two-pass speed audit
- 8
- Shopify Liquid
- TypeScript
- three.js
- GSAP
- Svelte islands
- webpack 5
01
The problem
The Gold Liposomal landing page was the single highest-spend acquisition surface on the store, and the slowest. It ran on its own bespoke layout, several generations removed from the base theme, and had accumulated the usual archaeology: a marketing tag added directly to the layout rather than through the tag manager, an A/B testing script loading synchronously, an icon font nobody was using at full weight.
Nothing was broken. That is what made it hard — every individual addition had been reasonable at the time, and the page looked exactly as designed. The cost was entirely in load order.
02
Approach
I audited the layout twice: once against lab traces to find what was blocking the render path, then again against the live document to confirm each script was actually still needed. Two of the eight findings turned out to be duplicates of things the tag manager was already loading — the cheapest wins available, because removing them changed nothing except the waterfall.
The fixes were ordered by risk, not by size, so the zero-risk changes shipped first and the ones needing client sign-off did not hold up the rest.
- Added font-display: swap to three @font-face rules — eliminated the invisible-text window at zero risk
- Added preconnect and dns-prefetch resource hints for the tag manager, font hosts and the review, payment and testing vendors
- Removed a Google Ads gtag snippet loading separately from the tag manager, and moved the Bing UET pixel into the container alongside it
- Removed a synchronous, render-blocking A/B testing script once it was confirmed no test was running
- Deferred an ~80KB render-blocking icon-font stylesheet using the media="print" onload pattern
- Deferred ~20KB of inline review-widget CSS behind an IntersectionObserver, so it loads on scroll rather than on paint
- Dropped a chat-widget stylesheet and disabled the corresponding app embed
03
The part worth talking about
The audit also surfaced a third-party script using eval() and calling two domains that had nothing to do with any vendor the client had knowingly installed. I stopped, flagged it for verification rather than removing it unilaterally, and documented exactly what it was doing.
That is the less glamorous half of performance work: most of the wins are deletions, and you cannot delete anything safely until you know who put it there and why.
04
Elsewhere on the same build
Beyond the landing page, this theme is where most of the store's interactive work lives — a three.js hero, GSAP scroll sequences, and Svelte islands mounted into Liquid sections for the pieces that genuinely needed state. It also ran a three-way homepage banner test, which is the reason the layout had accumulated as much tooling as it had.