Overview
What this challenge is about.
Run Lighthouse + WebPageTest baselines on 3 representative pages (home, product detail, cart). Set up Real User Monitoring (RUM) via Vercel Analytics or web-vitals.js. Ship 5 distinct performance interventions over 3 weeks: next/image conversion, font-display: swap + self-hosted fonts, JS bundle split + dynamic imports for non-critical components, defer third-party scripts (chat widget, A/B tool), preload hero image. Re-measure on RUM after each change. Deliver the GitHub PR series, a before/after Core Web Vitals dashboard, and a 4-page performance write-up.
The Brief
What you'll do, and what you'll demonstrate.
Cut Largest Contentful Paint by 50 percent and Cumulative Layout Shift below 0.1 on a Next.js storefront, measured on real user monitoring.
Earning criteria — what you'll demonstrate
- Diagnose web-performance bottlenecks using Lighthouse + WebPageTest + RUM
- Apply Next.js performance primitives (next/image, dynamic imports, font optimization)
- Measure performance changes on real users, not synthetic-only benchmarks
- Document performance work so a non-frontend reviewer understands the win
Program Fit
Where this fits in your program.
Sharpens the same skills your degree expects you to demonstrate.
Skills
Skills you'll demonstrate.
Each one shows up on your verified credential.
Careers
Roles this prepares you for.
Real titles. Real skill bridges. Pick the one closest to your trajectory.
Career mappings coming soon.