Volta Commerce Engine
D2C brand · $3M/yr revenue · Premium home goods
A $3M/yr DTC storefront had accumulated four years of Shopify theme customisation — bloated JavaScript, 4-second mobile load times, and a checkout flow with enough friction to explain a 1.8% conversion rate on paid traffic. The brief was to fix it. The answer was to rebuild it.
3.2×
Conversion rate lift
Measured against 90-day pre-rebuild baseline
0.8s
LCP on mobile
Down from 4.1s on the legacy Shopify theme
40%
CAC reduction
Paid channel efficiency after checkout friction removed
2.1×
Email revenue per subscriber
90-day post-launch measurement
The problem.
The brand had invested heavily in paid traffic — Meta, Google, and influencer partnerships. CAC was rising. Conversion rate on paid was 1.8%, against an industry average of 2.5–3.5% for the category. The assumption was that the ads needed work.
The Diagnostic found the opposite. The ad creative was above average. The problem was in the site: a 4.1s LCP on mobile, a cart that re-rendered on every interaction, and a checkout flow that asked for account creation before showing shipping costs. Three separate points of drop-off, each compounding the others.
The fix required a rebuild, not a patch. The existing theme had accumulated too many jQuery-era customisations to be recoverable through optimisation alone.
The architecture decision.
Headless with Next.js App Router and the Shopify Storefront API. Product pages as incremental static regeneration — served from CDN on first load, revalidated on inventory or price change. Cart as client-side state (Zustand) with no page reload on add-to-cart. Images through Cloudinary with automatic AVIF/WebP delivery.
The Shopify checkout link approach for actual checkout — meaning the payment flow stays on Shopify's infrastructure (PCI compliant, optimised for conversion) while the browse and discovery experience runs on the custom stack. This decision alone removed two weeks of build time and reduced the checkout to a single screen.
Stack: Next.js 14, TypeScript, Shopify Storefront API, Algolia, Cloudinary, Upstash Redis (cart session), Vercel Edge Network, Posthog for analytics, Sentry for error monitoring.
Eight weeks, in order.
Week 1–2
Audit and architecture decision
Performance audit of the existing Shopify theme: 4.1s LCP, unoptimised image pipeline, cart re-renders on every keystroke. Decision: rebuild headless with Next.js + Shopify Storefront API. Incremental static regeneration for product pages, edge caching for cart.
Week 3–5
Core infrastructure
Next.js App Router setup with Shopify Storefront API integration. Algolia predictive search replacing native Shopify search. Cloudinary image pipeline for automatic AVIF/WebP delivery with lazy loading. Custom cart engine in Zustand — no page reload on add-to-cart.
Week 6–7
Checkout and conversion layer
Identified two conversion blockers: a 3-step checkout flow (reduced to 1 with Shopify checkout link) and a lack of trust signals at the point of decision. Added: shipping estimate inline, return policy visible before checkout, social proof on product page.
Week 8
Launch, measurement, handoff
Phased rollout via Vercel deployment. Posthog for product analytics, Sentry for error boundaries. Full documentation written before launch. 72-hour monitoring window. Client team trained on content workflow and deployment process.
The result.
In the first 90 days post-launch: conversion rate moved from 1.8% to 5.8% (3.2× lift). LCP on mobile went from 4.1s to 0.8s. CAC on paid channels dropped 40% — not because the ads improved, but because more of the traffic they were already paying for converted.
Email revenue per subscriber increased 2.1× in the same period, driven by a post-purchase sequence built during the project that the previous theme didn't support.
The rebuild paid for itself in the first month of improved conversion. The CAC reduction alone represented a material improvement to the unit economics of every paid channel going forward.
“He built a system where every channel feeds the next. We're not running campaigns anymore — we're running a machine.”
— Founder, D2C Brand (name withheld on request)
What this engagement taught.
The site is often not the problem — but it's the cheapest thing to audit first.
The brand had spent aggressively on paid traffic assuming the ads were wrong. The ads were above average. Auditing the site first would have cost less and pointed to the right fix sooner. The Diagnostic exists to answer this question before money is committed to the wrong lever.
Checkout friction compounds non-linearly.
Each additional step in the checkout flow doesn't cost the same. Asking for account creation before showing shipping costs was removing roughly 30% of would-be buyers before they ever reached payment. One architectural change — Shopify checkout link — collapsed three screens to one.
CDN-first architecture should be the starting point, not the optimization.
The move from a server-rendered Shopify theme to ISR on Vercel's edge network wasn't a performance optimization — it was a correctness decision. Product pages served from CDN on first request, revalidated on inventory change. The LCP improvement was a side effect of the right architecture, not a tuning exercise.
If this maps to your situation — a system that's working against itself rather than for you — the application is the next step.
Related: Web Architecture insights →