[ 02 // HARD METRICS CASE STUDY ] · CLIENT: Qodeca / The Bay Club Company · ROLE: Webflow & Edge Performance Engineer · March 2026 – August 2026

Qodeca: Decimating Total Blocking Time from 750ms to 10ms with Edge Offloading

How architectural discipline and edge compute unlocked near-perfect Core Web Vitals for an elite digital agency.

TOTAL BLOCKING TIME 750ms → 10ms (-98.6%)

MOBILE PAGESPEED 41 → 71+ (Best Practices: 96)

FONT PAYLOAD -65% via WOFF2 conversion

BANDWIDTH SAVINGS High-volume PDF offload to Cloudflare R2

[ 01. THE BUSINESS STAKE ]

The Commercial Challenge

Digital agencies sell technical excellence to their clients, but their own flagship websites often suffer from bloated script chains, heavy background videos, and catastrophic Core Web Vitals. Qodeca's marketing platform was suffering from a 41 Mobile Lighthouse score and an intolerable 750ms Total Blocking Time (TBT). This directly impacted agency credibility during client audits and organic search ranking.

[ 02. SYSTEM ARCHITECTURE ]

Data Flow & Infrastructure Blueprint

[ User Interaction Event (Pointer / Scroll Threshold) ]
               │
               ▼ (Deferred Hydration)
       [ Custom Event Loader ]
        ├──▶ Google Tag Manager (Deferred until First Interaction)
        ├──▶ Analytics & Marketing Pixels
        └──▶ GSAP Animation Timelines
        
[ Asset Optimization Pipeline ]
  Webflow Asset API ──▶ Direct S3 / R2 Bypass (No Webflow re-encoding degradation)
  Local Font Engine  ──▶ Subsetted WOFF2 Delivery (-65% size payload)

[ 03. THE ENGINEERING HURDLE ]

Breaking Points & Architectural Solutions

Standard Webflow sites inject marketing scripts in the head, causing massive CPU main-thread starvation before the user can interact. Furthermore, Webflow's native media processing compresses hero background videos into sluggish MP4s with poor bitrate efficiency. I solved this with a two-fold engineering intervention: 1. Built an interaction-triggered script manager that holds heavy tracking scripts in memory until the user initiates an intent signal (scroll, pointermove, touchstart), dropping TBT to a staggering 10ms. 2. Bypassed Webflow's video re-compression pipeline by injecting optimized WebM/MP4 hero footage directly through the Webflow Asset API via presigned S3 URLs. 3. For agency client The Bay Club Company, engineered Cloudflare Workers integrated with Cloudflare R2 buckets to offload heavy PDF downloads, eliminating high Webflow bandwidth tier fees.

[ 04. QUANTIFIED BUSINESS OUTCOMES ]

Measurable Impact

▶ Slashed main-thread Total Blocking Time from 750ms to 10ms.

▶ Increased mobile PageSpeed from 41 to 71+, achieving 96 Best Practices and 100 SEO.

▶ Prevented thousands of dollars in annual bandwidth overages for client properties using Cloudflare R2.

[ 05. TECHNOLOGIES & TOOLS ]

Webflow Lumos Cloudflare Workers Cloudflare R2 TypeScript Vitest GSAP Performance Tuning

[ NEED THIS ARCHITECTURAL RIGOR? ]

Book an Architecture Discovery Call

Direct review of your AI platform, design system, or edge infrastructure.

Book Discovery (Cal.com)