Sports leader: PWA, +18% mobile conversion, Lighthouse 92.

When your mobile Lighthouse is 38 and 72% of your traffic is mobile, you're not losing points: you're losing carts.

The context

European e-commerce leader specialized in sports and outdoor, 240M EUR annual revenue, 6 million monthly visitors. Existing front-end in monolithic React SPA, heavy hydration, ungoverned third-party scripts. Product team of 18 people, Paris hub.

The problem

• Mobile Lighthouse: 38 (Performance), LCP at 4.8s on 4G
• Mobile bounce rate: 61%, up 9 points in 6 months
• Mobile conversion in free fall (-14% YoY)
• 27 third-party scripts loaded synchronously, 9 of them unused
• Product pages at 3.2 MB of JS

The approach

Progressive overhaul, not rewrite from scratch. Migration to Next.js App Router with Server Components by default, hydration reserved for interactive islands. Audit then brutal triage of third-party scripts.

The levers

• Server Components everywhere except cart, search, filters
• AVIF/WebP image pipeline via next/image, sizes correctly set
• Code splitting per route, smart prefetch on hover
• Service Worker for recently viewed product pages
• Tag manager replaced by server-side async loading

The stack

• Next.js 16 App Router, React 19
• Vercel Edge Network, ISR with on-demand revalidation
• Cloudflare Images for visual transformation
• GA4, Web Vitals reporting via Vercel Speed Insights

The results

1. Mobile Lighthouse: 38 to 92
2. LCP: 4.8s to 1.4s on 4G
3. Mobile conversion: +18% in 90 days post-launch
4. Bounce rate: -40%
5. Average cart: +12% (page speed/AOV correlation confirmed A/B)

What we learned

Server Components are powerful but break the habits of devs used to useState everywhere. Count three weeks of minimum internal training. The offline Service Worker brought +3% conversion on unstable connections, we should have prioritized it earlier. To redo: start with third-party script triage, it unblocks everything else.