Webpack 5 Module Federation

on YouTube ↗01h 02m

" summary

Module Federation for Webpack 5 lets apps import modules from other builds at runtime so separately deployed SPAs share code without rebuilding; it uses a small container runtime and a generated remote entry.js to fetch chunks, negotiates versions via share scopes and semantic version rules, supports an omnidirectional host model, and demo shows five independent builds composing into one shell with a 9.2 KB extra download and working cross-version React via an adapter. Built-in fallback, dashboard version control and IPFS-friendly distribution are described as workable next steps.

AI-written summary · about

" chapters (18)

1. 0:00Start
2. 0:40Intro
3. 2:48Context on Module Federation
4. 6:54Existing Options
5. 10:07The Next Step in JavaScript Architecture
6. 10:35Terminology
7. 16:30What is Module Federation
8. 19:23An Example
9. 26:56Container Plugin Deep Dive
10. 32:36Example at Scale
11. 33:34Demo Video
12. 35:05Applied Architecture
13. 35:38Another Example
14. 38:29Decentralized Routing
15. 40:41Non Webpack Compatibility
16. 41:12Federation Dashboard
17. 42:25Find Out More
18. 43:17Q&A

" related talks

• 31mModule Federation in Webpack 5Tobias Koppers · JSNation Live 2020
• 29mHow module federstion makes our life easierNithesh Adukkam Narayanan · JSWORLD Conference 2022 Online
• 51mBuilding a Micro-Frontend Application with Webpack 5 Module FederationSylvain Dedieu · Voxxed Days Luxembourg 2022
• 28mModule Federation: Theory vs PracticeMilan Holeš · FrontKon 2023
• 01h 13mThe Microfrontend Revolution, module federation, Webpack 5Pavel Chertorogov · HolyJS 2020 Moscow
• 55mModule Federation in 2024: Beyond WebpackZackary Jackson · Micro Frontends Conference 2024
• 29mThe Micro Frontend Revolution: Webpack 5 Module Federation and AngularManfred Steyer · AngularUP Experience 2020
• 30mFederated Angular: Micro Frontends with Module FederationManfred Steyer · JSWorld Conference 2021