what

https://micro-frontends.org/

特点

  • 独立
  • 融合
  • 技术栈无关
  • 独立
    • js 沙箱
    • 样式隔离
    • 元素隔离
  • 应用保活
  • 预加载
  • 数据通信
  • 静态资源补全

Why Not Iframe

https://www.yuque.com/kuitos/gky7yw/gesexv

实现思路

  • url change
  • WebComponent
  • 构建时集成
  • 运行时集成
  • iframe
  • 服务端集成

ModuleFederationPlugin

框架

web 框架

工具链

  • webpack
  • rspack
  • vite
  • parcel
  • roolup

https://lerna.js.org/

代码共享

  • copy
  • npm/cdn
  • Monorepo
  • micro fe

关联阅读:designsoftware-development-principles 对是否需要微前端的权衡。