什么是微前端

微前端是一种类似于微服务的架构，它将微服务的理念应用于浏览器端，即将单页面前端应用由单一的单体应用转变为把多个小型前端应用聚合起来的应用。各个前端应用可以使用不同的技术栈独立开发、独立部署。同时，它们也可以进行并行开发——这些组件可以通过 NPM、Git TagGit 或者 Git Submodule 来管理。

微前端目前为止还是比较年轻的架构模式，从如何实现应用自治、满足单一职责的原则、实现技术栈无关的重要特性到微前端的技术拆分方式，再到微前端业务拆分方式行业内都还没有实现统一和规范化。值得欣慰的是，在一些大厂的探索下，也已经涌现了不少相对成熟的方案：

• 阿里UmiJS团队孵化的qiankun
• single-spa
• nut(网易出品)
• 微前端在美团外卖的实践
• 微前端在小米CRM的实践
• 标准微前端架构在蚂蚁的落地实践

微前端的实现意味着对前端应用的拆分，拆分应用的目的并不是为了在架构上好看，它还可以提升开发效率和降低项目维护成本。把架构师、程序员从臃肿的单体应用中解放出来。微前端是一种代码组织模式，更是一种软件架构思想。微前端也不只可以应用在 Web 开发，在 App 开发中也大有用武之地，近几年炒的很热的小程序理论上也属于微前端的架构模式。

为什么采用微前端

• 前端遗留系统迁移：遗留系统采用与现今系统不同的技术栈，但又需要将遗留系统嵌入到现在新的系统中。在即不重写原有系统的基础之下，又可以抽出人力来开发新的业务。
• 后端解耦，前端聚合

• 兼容遗留系统：需要使用新的技术、新的架构，来容纳、兼容旧的应用

  实施微前端的六种方式

• 使用 HTTP 服务器的路由来重定向多个应用

• 在不同的框架之上设计通讯、加载机制，诸如 Mooa 和 Single-SPA
• 通过组合多个独立应用、组件来构建一个单体应用
• iFrame。使用 iFrame 及自定义消息传递机制
• 使用纯 Web Components 构建应用
• 结合 Web Components 构建

  参考

  【1】🏆 技术专题第四期 | 聊聊微前端的那些事
  【2】微前端那些事
  【3】可能是你见过最完善的微前端解决方案
  【4】微前端—将微服务理念扩展到前端开发【英】