Optimally using third-party services with Next.js
summary
Claim: cutting client JavaScript lets large e‑commerce sites jump Lighthouse scores from ~24 to ~83 and push TTI down to about two seconds. Uses Next.js features: the Script component with a worker strategy (via Party Town), afterInteractive/lazy strategies, server rendering and getStaticProps/ISR, and Edge middleware that rewrites URLs from small cookie key‑value pairs to serve personalized cached pages. Demo shows cookie→rewrite→personalized page delivered instantly and stickily from the CDN, with A/B variations rendered and working in production.
AI-written summary · about
chapters (7)
- 0:00Optimizing third-party services
- 1:23Client-side JS harms performance
- 5:58Next.js Script component
- 8:05SSR for render-critical content
- 9:47Edge middleware for personalization
- 15:00Live Edge middleware demo
- 20:39Conclusion and key takeaways
related talks
16mHigh-speed personalization with Next.js
24mOptimising React’s TTI
15mOptimising React TTI
14mOptimizing Third-Party Loading in Next.js
34mOptimizing Performance in Large-Scale React & Node.js Applications
37mSecret Shortcuts of Loading Web Performance
38mSecret Shortcuts of Loading Web Performance
32mPushing boundaries to the edge