什么是微前端

一种将可独立交付的前端应用程序组合成一个更大的整体的架构风格。这里强调是一种架构风格。

微前端解决什么问题

1. 更小、更内聚且可维护的代码库
2. 从组织角度来看，可实现团队自治
3. 更增量的升级、更新甚至重写前端部分的能力
4. 可以避免大型单体仓库，减少更多的冲突

如何拆分微前端

通过应用程序的限界上下文进行拆分

实践方案

1. 后端组合

主要通过后端模板配合服务器配置进行拼合

2. 前端组合

1. 通过 iframe 进行运行时集成
2. 通过 JavaScript 进行运行时集成
3. 通过 Web Components 进行运行时集成

iframe 具有天然的隔离性，保证 JS 和 CSS 不会产生冲突。其他前端运行时方案需要考虑 JS 和 CSS 的冲突处理，shadow DOM 提供了良好的样式隔离。

实现方案概述

1. 构建基座应用，用来管理微前端的加载
2. 通过路由匹配，处理微前端的资源进行加载执行