/Micro-front-end-example

收集各种微前端的各种方案,并且做成demo

微前端方案收集

以前以为微前端的方案唯独是 qiankun 是最佳,但是时间来到 2021 末,发现微前端在很多地方都有不一样的答案,并且各有优劣,本仓库主要是搜索各种微前端方案,并且做成 demo,给有需要的人一个直观的了解。

1. iframe(为什么不能作为主流方案)

  1. url 不同步。浏览器刷新 iframe url 状态丢失、后退前进按钮无法使用。
  2. UI 不同步,DOM 结构不共享。想象一下屏幕右下角 1/4 的 iframe 里来一个带遮罩层的弹框,同时我们要求这个弹框要浏览器居中显示,还要浏览器 resize 时自动居中..
  3. 全局上下文完全隔离,内存变量不共享。iframe 内外系统的通信、数据同步等需求,主应用的 cookie 要透传到根域名都不同的子应用中实现免登效果。
  4. 慢。每次子应用进入都是一次浏览器上下文重建、资源重新加载的过程。

来自于语雀

qiankun

  1. umi 为主机座,umi 为子应用的形式,通过静态路由的的配置形式。

模块联邦

京东的 MicroApp