8e0c7efa8f3c78a8e5abba5475fa66fa.jpg

一、What:微前端到底是什么?

通过主应用来加载子应用,而子应用由不同的功能按照不同的维度拆分而来,这就是微前端的定义
微前端可视为一颗大树中的各个组织,软件包则对应于组成各组织的细胞,而模块就是分子,组件等同于原子。

二、Why:我们为什么需要微前端?

引入微前端后,最显著的变化在于前端应用整体效能的提升:

  • 每个模块的前端部分均能实现独立开发、测试和部署;
  • 协同开发,不同技术栈能够构建同一前端部分;

但是,如同后端一样,架构重构是一项大工程。为了实现渐进式重构,我们在实际落地过程中首先要进行低风险的局部替换,例如升级依赖项、更替架构、UI 改版,调整技术选型等。

三、How:如何落地微前端?

最高效的方式首当其冲是成熟的微前端解决方案。例如主流的 iframe、Web Components、ESM、qiankun、EMP 等。
什么是微前端 - 图2
每种解决方案各有优劣,比如 iframe 可以直接加载其他应用,但无法做到单页导致许多功能无法正常在主应用中展示,EMP 更支持跨应用状态共享、跨框架组件调用、远程拉取ts声明文件、动态更新微应用等。