Iframe

优势

• 技术成熟
• 支持页面嵌入

• 天然支持运行沙箱隔离、独立运行

  劣势

• 页面之间可以是不同的域名

• 需要对应的设计一套应用通讯机制，如何监听、传参格式等内容

• 应用加载、渲染、缓存等体系的实现

  web component

  优势

• 支持自定义元素

• 支持shadow dom，并可通过关联进行控制

• 支持模版template和插槽slot，引入自定义组件内容

  劣势

• 接入微前端需要重写当前项目

• 生态系统不完善,技术过新容易出现兼容性问题

• 整体架构设计复杂,组件与组件之间拆分过细时,容易造成通讯和控制繁琐

  自研框架

  优势

• 高度定制化，满足需要做兼容的一切场景

• 独立的通信机制和沙箱运行环境,可解决应用之间相互影响的问题

• 支持不同技术栈子应用,可无缝实现页面无刷新渲染

  劣势

• 技术实现难度较高

• 需要设计一套定制的通信机制

• 首次加载出现资源过大的情况

  最终实现 - 自研框架

• 路由分发式

• 主应用控制路由匹配和子应用加载，共享依赖加载
• 子应用做功能,并接入主应用实现主子控制和联动