微前端

2020.12.30
微前端解决特定问题：技术栈无关
https://micro-frontends.org/
https://martinfowler.com/articles/micro-frontends.html
https://qiankun.umijs.org/zh

image.png

最早的微前端是iframe的spa版
目前用的好的是阿里的qiankun

微前端原理

1. 加载应用 （html-loader）
   1. 通过html，解析出页面加载的css，js，和容器html

？？？2. css污染

1. 每个子应用改在，用不同的css前缀
2. 动态样式表
3. shadow dom
4. 。。。css in js
5. scroped css
6. js沙箱
   1. Eval(function(){js content})内部执行加载的js 完成了封装
   2. window.xx = 123
      1. proxy window
   3. window 快照
      1. 每次应用加载前，记录一下，应用写在的时候，恢复一下
7. 路由切换
   1. 拦截一下addEventListener， 拦截一下hashchage，popstate（history）记录

？？
子应用生命周期
通信方案