Skip to content

随着 Web 前端工程日趋复杂,也带来了更大的工程理治挑战,微前端在大型前端工架程构解决方案中成已为重要思路之一。

微前端带来这么一系列的好处:

  • 应用自治。只需要遵循统一的接口规范或者框架,以便于系统集成到一起,相互之间是不存在依赖关系的。
  • 单一职责。每个前端应用可以只关注于自己所需要完成的功能。
  • 技术栈无关。你可以使用 Angular 的同时,又可以使用 React 和 Vue。

除此,它也有一系列的缺点:

  • 应用的拆分基础依赖于基础设施的构建,一旦大量应用依赖于同一基础设施,那么维护变成了一个挑战
  • 拆分的粒度越小,便意味着架构变得复杂、维护成本变高
  • 技术栈一旦多样化,便意味着技术栈混乱

架构模式

就当前而言,要设计出一个微前端应用不是一件容易的事 —— 缺少最佳实践。在不同的落地案例里,使用的都是不同的方案。出现这种情况的主要原因是,每个项目所面临的情况、所使用的技术都不尽相同。为此,我们需要了解一些基础的微前端模式。

  • 基座模式:
  • 自组织模式:

关键技术

  • 应用的加载与切换:应用加载、应用入口、应用路由
  • 应用的隔离与通信:JS 隔离、样式隔离、父子通信、子子通信

工程问题

参考资料