微前端原理
在 SPA 模式下微应用之间的切换并不是靠 Browser 进程进行处理,而是靠 Renderer 进程中的 JavaScript 逻辑进行处理,此时浏览器内部的运行机制无法起到细粒度的管控作用,需要额外处理以下一些问题:
- 状态:根据自定义逻辑来管控微应用的状态,包括(预)加载、加载、卸载、(预)渲染等
- 隔离:在同一个浏览上下文中进行 DOM 和 JS 隔离
- 性能:例如支持微应用的预加载、预渲染和缓存,微应用之间的资源共享
- 通信:如果几个微应用同时并存,如何实现微应用之间的通信
为了使微前端尽可能的模拟浏览器自身的运行机制,需要设计一个通用的 JavaScript 框架,这个框架可以协助主应用快速接入并管理不同的微应用,如下所示:

微前端原理之隔离
性能
主要是预加载关键资源