Shopify Performance: How We Cut Load Times by 26% on Gezeiten

We rebuilt the Gezeiten storefront with performance as a first-class design constraint. Not as an afterthought, not as a post-launch audit, but as a structural requirement from the first wireframe. The result: 26% faster loads and 11% lower bounce rate. Here is the exact approach we used — and the framework we apply to every performance engagement.

Google’s Core Web Vitals are the standard we optimise against:

Largest Contentful Paint (LCP) measures when the main content becomes visible. Target: under 2.5 seconds. The biggest levers are image optimisation, server response time, and critical CSS.

Cumulative Layout Shift (CLS) measures visual stability — how much the page jumps around as it loads. Target: under 0.1. The biggest offenders are images without dimensions, dynamically injected content, and late-loading fonts.

Interaction to Next Paint (INP) measures responsiveness — how fast the page reacts to clicks. Target: under 200ms. The biggest levers are reducing JavaScript execution and breaking up long tasks.

We report all three metrics from field data, not just lab scores. A perfect Lighthouse score means nothing if real users on mobile connections are still waiting three seconds for the page to load.

Shopify performance optimisation operates at three layers:

1. Theme layer. Where most problems live and where the biggest gains are. Inefficient Liquid loops, excessive DOM size, unoptimised images, render-blocking stylesheets.

2. App layer. Every third-party app adds JavaScript. Some add 50KB. Some add 500KB. The median Shopify store has 15–20 apps installed — and many inject scripts on every page regardless of whether they are needed.

3. Infrastructure layer. Shopify’s CDN is world-class, but misconfigured DNS, missing preconnect hints, and suboptimal image formats can still add hundreds of milliseconds.

Every performance engagement starts with a structured audit:

Lab testing. Lighthouse, WebPageTest, and Chrome DevTools Performance profiles on the five most-visited page types — homepage, collection, product, cart, checkout. We test on 4G and 3G.

Field data analysis. Lab tests do not reflect real users. We pull CrUX data and Shopify’s own analytics to see what actual visitors experience across devices and geographies.

Waterfall analysis. Every resource, every dependency chain, every blocking script — mapped to reveal the critical rendering path.

Third-party audit. We inventory every script, measure its size and execution time, and classify it: essential, optimisable, or removable. This step alone often yields the biggest single improvement.

After auditing dozens of Shopify stores, these are the highest-impact fixes:

App script consolidation. Audit every app script: defer it, conditionally load it, or replace it with native functionality. A store with 20 apps can often cut its JavaScript payload in half.

Critical CSS extraction. Inline the CSS needed for above-the-fold content and defer the rest. This eliminates the render-blocking problem that slows almost every Shopify theme.

Gezeiten’s previous storefront looked premium but loaded slowly. Full-width product photography, editorial layouts, and brand storytelling sections — beautiful, but heavy.

Our approach:

Rebuilt the theme on Dawn with custom components, eliminating unused framework code.

Implemented responsive image pipelines with automatic WebP conversion and srcset.

Replaced three JavaScript-heavy apps with native Liquid/metafield solutions.

Inlined critical CSS and deferred non-essential stylesheets.

Added resource hints for Shopify’s CDN and third-party payment providers.

Performance is not about removing features. It is about implementing the same features with engineering discipline. The Gezeiten storefront looks as premium as before — without the performance tax.