微前端是一种类似于微服务的架构思想在前端领域的应用。它旨在将一个庞大、笨重的单体(Monolithic)Web应用,拆解成多个更小、更专注、可以独立开发、测试、部署和演进的“微应用”

这些微应用最终在主应用(或称基座)的协调下,被无缝地集成在一起,共同构成一个完整的用户体验,其核心价值在于解决了大型应用在工程、组织和技术层面的痛点:

  • 技术栈无关:允许不同团队为各自的微应用选择最合适的技术栈(React,vue,Angular 等),这对于渐进式重构老旧系统或尝试新技术尤为重要。
  • 团队自治与独立部署:每个微应用可以由一个独立的团队全权负责,拥有自己的代码库和部署流水线,极大地降低了团队间的协作耦合,使得发布更加频繁和安全。
  • 增量升级与容错:可以独立地升级或重写应用的某个部分,而无需对整个系统进行伤筋动骨的改造。单个微应用的故障影响范围也更可控。

当然,微前端也带来了新的挑战,如应用间通信、样式隔离、路由管理、公共依赖的共享和版本控制等。为此,社区也涌现出了如 single-spa qiankunWebpack Module Federation 等成熟的解决方案,它们通过路由劫持、JS 沙箱、CSS 作用域等技术,帮助我们应对这些挑战。