微前端框架概览与差异分析 🛠️
微前端架构是一种将大型前端应用拆分成多个独立、自治模块的架构模式，这些模块可以由不同的团队开发、部署和维护。以下是一些流行的微前端框架及其特点和差异：
1. Qiankun 🌐
- 基于Single-SPA：Qiankun是基于Single-SPA的微前端解决方案，提供了更加开箱即用的API。
-
特点：
- 方案成熟且活跃度高。
- 适配成本较高，需要对工程化、生命周期、静态资源路径、路由等进行适配改造。
- 无法支持Vite等ESModule脚本运行，需要配合
vite-plugin-qiankun包支持。
-
不足：
- CSS沙箱采用严格隔离会有各种问题。
- JS沙箱在某些场景下执行性能下降严重。
- 无法同时激活多个子应用，也不支持子应用保活。
2. Single-SPA 📦
- 微前端的灵活底层框架：Single-SPA是一个将多个单页面应用聚合为一个整体应用的JavaScript微前端框架，不限技术栈，支持独立部署每一个单页面应用。
-
优点：
- 敏捷性 - 独立开发、独立部署。
- 技术栈无关，微应用具备完全自主权。
- 增量升级，适合渐进式重构。
-
缺点：
- 需要自己去加载子应用。
- 不支持JavaScript沙箱隔离，需要使用额外的库进行隔离。
- 不支持CSS隔离，需要自己解决样式冲突问题。
3. Micro-App 📚
- 京东推出的简易微前端框架：基于类WebComponent进行渲染，从组件化的思维实现的微前端技术。
-
特点：
- 使用简单，接入微前端成本低。
- 零依赖，兼容所有框架。
- 提供了JS沙箱、样式隔离、元素隔离、预加载、资源地址补全、插件系统、数据通信等一系列完善的功能。
4. Wujie 🌪️
- 腾讯的Web Components + iframe微前端框架：基于WebComponent容器+iframe沙箱，能够完善的解决适配成本、样式隔离、运行性能、页面白屏、子应用通信、子应用保活、多应用激活、Vite框架支持、应用共享等用户的核心诉求。
-
特点：
- 主应用、子应用使用成本低，组件式使用，支持子应用嵌套。
- 支持保活模式、单例模式、重建模式，支持多应用加载，并保持子应用路由同步的能力。
- 加载速度快，运行速度快，实现CSS沙箱、JS沙箱的原生隔离。
5. Garfish 🚀
- 字节跳动的高效微前端框架：Garfish是一个高效的微前端框架，旨在提供更好的性能和更简单的使用体验。
6. EMP 📈
- 欢聚时代的模块共享与构建优化工具：基于Webpack 5 Module Federation的微前端方案。
-
特点：
- Webpack联邦编译可以保证所有子应用依赖解耦。
- 应用间去中心化的调用、共享模块。
- 模块远程TS支持。
-
不足：
- 对Webpack强依赖，老旧项目不友好。
- 没有有效的CSS沙箱和JS沙箱，需要靠用户自觉。
- 主、子应用的路由可能发生冲突。
总结 📊
选择微前端框架时，需要考虑框架的成熟度、社区支持、技术栈兼容性、沙箱隔离能力、性能以及是否支持现代构建工具等因素。每个框架都有其独特的优势和局限性，选择时应根据项目的具体需求和团队的技术偏好来决定。
