微前端前言

主框架不限制对应用的技术栈的访问，微应用拥有完全的自主权。

微应用仓库是独立的，前后端可以独立开发。部署后，主框架将自动同步更新。

面对各种复杂的场景，我们通常很难对一个已有的系统进行全技术栈的升级或重构，而微前端是一个非常好的实现渐进式重构的手段和策略。

每个微应用的状态是隔离的，运行时状态是不共享的。

微前端架构旨在解决单个应用从普通应用演变为巨石应用后，由于相对较长时间跨度内涉及的人员和团队数量的增加和变化而无法维护的问题。这种问题在企业Web应用中尤其常见。

1.url不同步。浏览器刷新iframe url状态丢失，并且不能使用后退和前进按钮。

2.2号。UI不同步，不享受DOM结构。想象一下，在屏幕右下角的iframe中有一个1/4的带有遮罩层的子弹框。同时，我们要求项目符号框显示在浏览器的中央，当浏览器调整大小时，它会自动居中。

3.全局上下文是完全隔离的，内存变量是不共享的。为了满足iframe内外系统通信和数据同步的要求，需要将主应用的cookie传输到不同根域名的子应用中，以达到免登录的效果。

4.慢点。每一次子应用的进入，都是一个浏览器上下文重构和资源重载的过程。

通过监听url变化事件，匹配渲染的子应用，在路由发生变化时进行渲染，这种思路也是微前端的主流实现方式。同时，single-spa要求子应用修改渲染逻辑，并公开bootstrap、mount和unmount三种方法，分别对应初始化、渲染和卸载，这也导致子应用修改入口文件。太基础，太贵，不推荐。

钱坤是阿里推出的基于单spa的微前端实现库，旨在帮助你更简单、无痛苦地构建一个可量产的微前端架构系统。因为它是基于single-spa封装的，所以single-spa的特点也被钱坤继承了。成本比single-spa低，比MicroApp高。

MicroApp是JD.COM推出的基于WebComponent的微前端框架。它不同于目前流行的开源框架。它从组件思维实现微前端，旨在降低入门难度，提高工作效率。是目前市场上访问微前端成本最低的框架，提供JS沙箱、样式隔离、元素隔离、预加载、资源地址补全、插件系统、数据通信等一系列完善的功能。是目前市场上接入微前端成本最低的方案。

单一spa github地址:/单一spa/单一spa

https://qiankun.umijs.org/zh钱坤官方网站

MicroApp官网:https://cangdu.org/micro-app/