Case Study: Migrating a Scale-Up Web App from Next.js to Astro for 100/100 Core Web Vitals
Why eliminating monolithic hydration waterfalls reduced First Contentful Paint from 3.2s to sub-100ms and cut client bundle size by 84%.
Why eliminating monolithic hydration waterfalls reduced First Contentful Paint from 3.2s to sub-100ms and cut client bundle size by 84%.
When marketing pages and SaaS application frontends are built with traditional monolithic single-page frameworks, the browser must download, parse, and execute hundreds of kilobytes of JavaScript before the page becomes fully interactive.
When client team Vertex brought us in to audit their conversion funnel, our studio migrated their public marketing and documentation surface from Next.js to Astro 5 + React 19 islands.
| Metric | Next.js 15 (Full Hydration) | Astro 5 (Zero-JS + Islands) | Improvement |
|---|---|---|---|
| First Contentful Paint | 3.2s | 0.18s | 17.7x Faster |
| Largest Contentful Paint | 3.4s | 0.25s | 13.6x Faster |
| Total JavaScript Shipped | 342 KB | 38 KB | 88.9% Reduction |
| Lighthouse Score | 72 / 100 | 100 / 100 | +28 pts |
By default, Astro renders static HTML with zero JavaScript. Interactive widgets (such as our 3D perspective switcher, pricing calculator, and auth modal) mount client-side React islands via client:load or client:idle.