Micro Frontends, Keep Using That Word, I Don’t Think It Means What You Think It Means
summary
Company starts with tiny SPA that balloons into dozens of pages and teams, so the solution enforces high cohesion and limited blast radius with component-local APIs and explicit module boundaries. Practical options compared: publish npm packages, adopt a Lerna monorepo (used successfully here) to share React and dependencies, or isolate modules via web components, per-route apps, iframes or single-spa hooks. Outcome: Lerna works after a one‑time upgrade to a single React version; tradeoff is the upfront refactor and stricter dependency coordination.
AI-written summary · about
chapters (15)
- 0:00Introduction and buzzword critique
- 5:51Evolution from simple app to monolith
- 8:07Breaking down the monolith into modules
- 11:01Challenges of micro frontends vs microservices
- 16:04Defining goals before choosing solutions
- 18:32NPM packages as micro frontend solution
- 24:00Lerna for monorepo management
- 26:14Web components for framework-agnostic modules
- 28:46Route-based micro applications
- 31:38Iframes for isolated components
- 33:55Single SPA framework integration
- 36:06State and event communication between modules
- 38:14WeWork’s implementation and lessons
- 39:16Key takeaways and final advice
- 41:06Q&A session
related talks
29mFrom Monolithic Web App to Micro-Frontends – Extending Microservices Architecture to the Frontend
24mScaling Frontend Development using Micro-frontends
29mSPAs are dead. Long live Microfrontends.
57mMicro Frontends – a strive for fully verticalized systems
45mMicro Frontends in Action!
48mMicrofrontend Architecture – technical implementation.
36mMicro Frontends - Breaking Monoliths
52mMicro frontends: prepare for the ride