30% faster page loads
Methodology and measurable results
statuslive
stackNext.js 15, Lighthouse CI, web-vitals
updated2026
LighthouseWeb VitalsOptimization
01 / / the problem
Performance optimization is a niche where few engineers can produce measurable results. This case study turns my 30% improvement on a real enterprise project into reproducible methodology.
02 / / what i built
→"Before" and "after" versions of the same site, both live
→Live Lighthouse score comparison
→Web Vitals comparison (LCP, FID, CLS, TTFB)
→Detailed writeup of each optimization with code
→Loading waterfall comparison
→Bundle size analysis
→Real user metrics from visitor sample
03 / / how i built it
Next.js 15
Both versions use the same framework — proves the difference is technique, not stack
Lighthouse CI
Automated scoring on every deploy
web-vitals
Real user metric collection
04 / / live demo
→ open live demo at https://performance.drodriguez.site
Loom walkthrough — 90 seconds
Demo credentials shown on the demo's landing page.
05 / / production extensions
Things deliberately out of scope for the demo, but I'd add for production:
→CDN edge caching strategies
→Image format negotiation (AVIF, WebP)
→Database query optimization
→Server-side rendering vs static generation tradeoffs