微前端实现方式对比

一、Iframe

优势：

1、技术成熟

2、支持页面嵌入

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

劣势：

1、页面之间可以是不同域名

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

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

 

二、web component

优势：

1、支持自定义元素

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

3、支持模板template和插槽slot，引入自定义组件内容

劣势：

1、接入微前端需要重新当前项目

2、生态系统不完善，技术过新容易出现兼容问题

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

 

三、自研框架

优势：

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

2、独立的通讯机制和沙箱运行环境，可以解决应用之间相互影响的问题

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

劣势：

1、技术实现难度较高

2、需要设计一套定制的通讯机制

3、首次加载会出现资源过大的情况

标签：通讯,自定义,方式,前端,支持,劣势,组件,对比,页面
来源： https://www.cnblogs.com/MarsPGY/p/15550672.html