← Back to Insights

We cut TBT by 87%. Conversion went up 34%. Here's exactly how.

Performance optimization in e-commerce is plagued by vanity metrics. Agencies sell "Lighthouse scores" and "First Contentful Paint" improvements that look great on a slide deck but do absolutely nothing to the bottom line.

I don't care about Lighthouse scores. I care about Total Blocking Time (TBT). TBT is the metric that measures human frustration. It's the amount of time the user is furiously tapping "Add to Cart" while the browser is frozen, busy processing a bloated JavaScript bundle.

Here is exactly how we took a high-volume DTC brand, slashed their TBT by 87%, and watched their conversion rate jump 34%.

The Baseline: A Monolith in Distress

The client was running a standard monolithic architecture. They were doing volume, but their mobile conversion was abysmal. When we ran the profiles, the issue was glaring: a TBT hovering around 2,400ms on a mid-tier Android device.

A user would land on a product page, the image would load (giving the illusion of speed), but the main thread was completely locked. The "Buy Now" button was a dead pixel for two and a half seconds.

In e-commerce, two and a half seconds of frustration is a lifetime. It's the difference between a spontaneous purchase and an abandoned tab.

The Surgery: Moving Logic to the Edge

We didn't "optimize" their theme. We threw it away. We architected a Headless solution designed specifically to protect the main thread at all costs.

1. Zero-JS by Default

We adopted an architecture where HTML is shipped pre-rendered, with zero client-side JavaScript by default. The browser receives pure, static markup. The page isn't just fast; it's instant. It doesn't need to "hydrate" before it becomes interactive.

2. Surgical Hydration

We only loaded JavaScript exactly where and when it was needed. The Add to Cart button? It hydrates when it becomes visible. The image carousel? It hydrates on interaction. We eliminated the global "bundle" concept entirely.

3. Edge-Computed Personalization

The client previously used a heavy client-side script to handle localized pricing and dynamic discounts. It blocked rendering. We moved all of this logic to Cloudflare Workers. The personalization was computed at the edge, milliseconds from the user, and delivered as static HTML. The browser did zero thinking.

Stop asking the user's $200 Android phone to compute your complex business logic. Do it on the edge.

The Results

Post-deployment, the metrics shifted drastically:

  • Total Blocking Time: Dropped from 2,400ms to 310ms (an 87% reduction).
  • Time to Interactive: Dropped from 6.2s to 1.4s.
  • Mobile Conversion Rate: Increased by 34% within the first 14 days of launch.

We didn't change the product. We didn't change the pricing. We didn't even fundamentally change the visual design of the product page.

We simply stopped frustrating the user. We removed the friction between intent and transaction. When you build infrastructure that respects the user's time and device constraints, revenue isn't a dark art—it's a mathematical certainty.