Micro frontends: Unbelievably True Life Story

on YouTube ↗33m

" summary

A real-world enterprise migration from a 2019 single-page Angular monolith to microfrontends is described: new features were packaged as web components, a shared core Angular/runtime was provided via a central bundle and webpack externals, and later Module Federation was adopted. The migration yielded roughly ~1 MB saved per component and improved hiring and feature delivery, while increasing build times, CI/CD complexity, and requiring extra work on dependency versioning and runtime code restructuring.

AI-written summary · about

" chapters (12)

1. 0:00Micro frontends intro
2. 5:00Why we chose micro frontends
3. 6:21First Angular component
4. 7:49Converting to web components
5. 8:55Micro frontend interactions
6. 10:01Optimizing dependencies with Webpack
7. 11:46Shared core for dependencies
8. 14:14Dynamic component dependencies
9. 15:38Module federation for code sharing
10. 18:52Further optimizations
11. 20:17Results and conclusion
12. 21:25Q&A

" related talks

• 48mMicrofrontend Architecture – technical implementation.Reinis Pakers · DevClub.lv 114th Frontend focused event
• 11mTransforming Enterprise Frontends with Micro-Frontend ArchitecturesNasir Sayed · Site Reliability Engineering (SRE) 2025
• 24mMicrofrontendsDavid den Toom · React Live 2019
• 25mMicro Frontend: a microservice architecture from your frontend web appsWilson Mendes · JSConf.Asia 2018
• 47mMicro Frontends UnmaskedManfred Steyer · Micro Frontends Conference 2024
• 21mMicro-frontends: 3 years agoMax Gallo · JSWorld Conference 2022
• 31mMigrating from Monolith to MicrofrontendsYaprak Ayazoglu · ConfrontJS 2018
• 25mMicrofrontends: a Modern Approach to Complex Web ApplicationsFederico Stefani · Intersection Conference 2023