什么是微前端?
微前端就是可以和多个可以独立发布功能的团队一起构建现代化web应用程序的技术、策略和方法,将臃肿的项目分割成更小、更易于管理的部分,然后明确它们之间的依赖关系。项目的技术选择,项目的代码库,项目团队,以及项目的发布过程都应该能够相互独立地操作和进化,而不需要过度的协调。微前端架构是一种类似于微服务的架构,它将微服务的理念应用于浏览器端,就是 Web 应用由单一的单体应用转变为多个小型前端应用聚合为一的应用
为什么要用微前端?
拆分巨型应用,使应用方便迭代更新
兼容历史应用,实现增量开发
特点:
- 独立部署
- 增量迁移
- 团队自治
- 松耦合代码
优点:
-
通过路由进行跨应用程序通信
-
解决了大型项目如何迭代的问题
-
解决了多团队技术栈不同的问题,实现react和Vue等框架整合 缺点:
-
有效载荷大小
-
环境差异配置难
-
业务和治理复杂
微前端结构方案:
1.自由组织模式
没有特别形势,类似iframe嵌套、npm包自由发挥
2.基座模型
类似微服务的注册中心模式,有个基座,其他应用都往里加
3.去中心模式
webpack5模块联邦,多个应用可以互相嵌套,可以深入到组件导入导出
主流微前端框架
国内使用基座模式偏多
Single-Spa:最早的微前端框架,兼容多种前端技术栈。
Qiankun:基于Single-Spa,体验技术部的开源微前端框架。