Serving Millions of Pages with Micro-Frontends: Inside The Weather Company
In this episode of Micro-Frontends in the Trenches, Luca sits down with Noel Madali, Consumer Product Principal Architect at The Weather Company, to unpack a decade-long architectural evolution that took weather.com from an Angular and Drupal stack all the way to Next.js on Vercel.Noel has spent around ten years at The Weather Company, starting as a senior engineer and helping modernise the platform through several cloud migrations along the way, from Akamai and Drupal to Kubernetes on AWS, then IBM Cloud, and finally back to AWS with parts of the estate now running on Vercel. He walks through why the micro-frontend model resonated so naturally with their existing backend-for-frontend pattern, how they split weather.com by path across web, CMS, and API projects, and how labs.weather.com hosts over twenty experimental micro-frontends under a single group.The conversation gets into the real trade-offs of operating at this scale. Noel explains their "split brain" migration approach using Akamai in front of Vercel, the many flavours of caching they have wrestled with, and how they lean on React Server Components, ISR, and the newer cache components to serve millions of high-cardinality pages without triggering millions of revalidations. He and Luca also dig into the developer experience wins from Vercel's micro-frontend tooling, the chicken-and-egg gotchas of adding new projects into a git-flow process, how they layer Caddy on top of the built-in proxy for local development, and where remote micro-frontends fit into their roadmap with a shared footer as the likely first candidate.If you care about micro-frontends, Next.js at scale, caching strategy, or the messy reality of a multi-year platform migration, this one is packed with hard-won lessons from the trenches.This season of Micro-Frontends in the Trenches is brought to you by Vercel. To learn how Vercel can cut build times, boost developer velocity, and improve user experience with micro-frontends, visit vercel.com/microfrontends 00:00 Welcome and today's weather-themed episode02:32 Meet Noel and his 10 years at The Weather Company03:45 The migration path from Angular to Next.js05:05 Why micro-frontends fit their backend-for-frontend pattern06:18 Two flavours of micro-frontend: full pages and reusable components06:40 Splitting weather.com by path: web, CMS, and API projects07:36 labs.weather.com and 20+ experimental micro-frontends08:22 Web micro-frontends vs native mobile apps09:07 Backend-for-frontend per domain and monorepo decisions11:49 What drove the move away from Angular14:19 How AI tooling accelerated Next.js adoption15:02 The apex domain challenge and the "split brain" setup16:05 Sponsor: micro-frontends and team focus on Vercel17:13 The split brain pattern explained with Akamai19:49 Caching strategies and where the logic lives21:27 Cache components and React Server Components23:04 Serving millions of high-cardinality pages25:15 Core Web Vitals and measuring the migration27:12 What's next: cache components and stabilisation28:32 Multi-zone approach and team structure29:44 Monorepo and polyrepo micro-frontends30:27 The weather.com/retro Nuxt project32:19 Running multiple frameworks side by side33:20 Developer experience: Caddy, proxies, and fallbacks35:05 Gotchas: the chicken-and-egg of adding new micro-frontends37:19 Observability across independent micro-frontends39:29 The future: remote micro-frontends and a shared footer41:23 If you could start from scratch, what would change?43:37 The one thing Noel would do differently45:04 Wrap-up and closing thoughts
