微前端 Micro-Frontends - 概念
什么是微前端？（what）
微前端是一种类似于微服务的架构，它将微服务的理念应用于浏览器端，即将 Web 应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。各个前端应用可以独立运行、独立开发、独立部署。微前端的核心在于拆，拆完后在合。
为什么需要用到微前端？（why）
原先的单体应用
- 当我们的项目越来越复杂的，项目中的功能模块也越来越多，这就导致了一个问题，代码复杂。
- 代码构建部署缓慢
- 对开发人员非常不友好（特别是新接手的人来说，找个模块可能都要好久）
- 模块耦合太高，一个模块崩了，可能会影响到整个系统
- 跨团队间的合作，比如一个 vue 团队，一个 react 团队，两个团队使用的技术栈是不同的，如何在同一个项目中使用两种技术栈？
微前端应用
- 不同的模块可以拆分成不同的项目，不同的团队去维护，对于一个项目来说相当于化整为零，每个项目都可以自己部署开发，代码体量小了，构建部署也就很快，开发人员只要着重去了解某个模块的功能，模块的耦合度降低了，就算一个模块挂了，也不会影响整个系统的运行
- 不同的团队可以选择不同的技术栈，只需要在后续的整合过程中衔接起来就行（因为最后大家都是 js）
什么时候需要用到微前端？（when）
当我们的项目已经非常复杂了，我们这时候可以考虑使用微前端来拆分了（这里的工作量就很大了，相当于整个系统的重构）。
如果一开始我们就预估到我们的项目会很大，那么我们可以一开始就使用微前端来管理我们的项目。
需要照顾到老代码时，但是目前又使用的是一些新技术，涉及到不同技术栈的使用时，可以考虑使用微前端。
总结下来遵循以下几个原则：
A. 微前端最佳的使用场景是一些B端的管理系统，既能兼容集成历史系统，也可以将新的系统集成进来，并且不影响原先的交互体验。
B. 整体的微前端不仅仅是只将系统集成进来，而是整个微前端体系的完善，这其中就包括：
1)：基座应用和微应用的自动部署能力。
2)：微应用的配置管理能力。
3)：本地开发调试能力。
4)：线上监控和统计能力等等。
只有将整个能力体系搭建完善，才能说是整个微前端体系流程的完善。
C. 当发现使用微前端反而使效率变低，简单的变更复杂那就说明微前端并不适用。
微前端有哪些框架
Single-Spa ：最早的微前端框架，兼容多种前端技术栈。
Qiankun ：基于Single-Spa，阿里系开源微前端框架。
Icestark ：阿里飞冰微前端框架，兼容多种前端技术栈。
Ara Framework ：由服务端渲染延伸出的微前端框架。
Mooa ：基于Angular的微前端服务框架，这个其实还是基于 single-spa 的
实现微前端的几种方案？（how）
目前主流的微前端解决方案
- Single-SPA single-spa 是一个用于前端微服务化的 JavaScript 前端解决方案 (本身没有处理样式隔离， js 执行隔离) 实现了路由劫持和应用加载
- qiankun 基于Single-SPA, 提供了更加开箱即用的 API （ single-spa + sandbox+ import-html-entry ） 做到了，技术栈无关、并且接入简单（像iframe 一样简单）