微前端是什么?

参考网站:
https://micro-frontends.org
https://microfrontends.com

微前端就是与多个可以独立发布功能的团队一起构建现代化web应用程序的技术、策略和方法,将大而可怕的事物分割成更小、更易于管理的部分,然后明确它们之间的依赖关系。我们的技术选择,我们的代码库,我们的团队,以及我们的发布过程都应该能够相互独立地操作和进化,而不需要过度的协调。微前端架构是一种类似于微服务的架构,它将微服务的理念应用于浏览器端,即将 Web 应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。
在这里插入图片描述

为什么要用微前端?

拆分巨型应用,使应用方便迭代更新
兼容历史应用,实现增量开发

特点:

  • 独立部署
  • 增量迁移
  • 团队自治
  • 松耦合代码

优点:

  • 通过路由进行跨应用程序通信
  • 解决了大型项目如何迭代的问题
  • 解决了多团队技术栈不同的问题,实现react和Vue等框架整合

缺点:

  • 有效载荷大小
  • 环境差异配置难
  • 业务和治理复杂

微前端结构方案

  • 自由组织模式
    没有特别形势,类似iframe嵌套、npm包自由发挥
  • 基座模型
    类似微服务的注册中心模式,有个基座,其他应用都往里加
  • 去中心模式
    webpack5模块联邦,多个应用可以互相嵌套,可以深入到组件导入导出

主流微前端框架

国内使用基座模式偏多
Single-Spa:最早的微前端框架,兼容多种前端技术栈。
Qiankun:基于Single-Spa,阿里系开源微前端框架。

Logo

基于 Vue 的企业级 UI 组件库和中后台系统解决方案,为数万开发者服务。

更多推荐