1. MPA+路由分发

这种方式就是在多个独立的 SPA 应用之间跳转，通过把界面、导航、皮肤做成类似的样子，让用户感觉在像是用一个应用。

优点：

  1. 框架无关；
  2. 独立开发、部署、运行；
  3. 应用之间 100% 隔离。

缺点：

  1. 应用之间的彻底割裂，导致复用困难（比如每个应用都带有左侧和顶部导航）；
  2. 每个独立的 SPA 应用加载时间较长，容易出现白屏，影响用户体验；
  3. 如果要做同屏多应用，不便于扩展。

2. 类 Single-SPA

这种模式一般分为主应用和子应用，主应用的代码一般非常简单，仅作为加载容器，管理子应用的生命周期。主应用捕获全局的路由事件，基于当前路由判断需要加载哪一个子应用。比如路由为main/vue，我们就加载 /vue 子应用；当路由为 /main/react，则加载 /react 子应用。最后，当路由切走后，也要卸载该应用。

优点：

  1. 框架无关；
  2. 独立开发、部署、运行；
  3. 项目自由切割，应用可以自由组合，方便复用；
  4. 便于自由扩展功能。

缺点：

  1. 子应用需要实现 mount 和 unmount 等钩子，侵入式的代码开发体验并不友好；
  2. 全局污染和资源竞争。

3.基座式 SPA，主从应用设计

原理和 Single-SPA 类似。不同点在于基座应用会包含应用依赖的绝大多数环境，包括基础框架、基础组件与第三方依赖包。当我们的主应用启动后，基本就有了全套的运行时环境。同时路由也有区别，子应用一般会把自己的路由注册到主应用中，并不接管系统路由，子应用更像是主应用的一个“路由模块”。

优点：
1. 这种模式打包出来的子应用只包含了业务代码，体积小、加载快、用户体验好。

缺点：
1. 基座与框架强相关。

张浩（网易严选）