微前端有哪些方式可以实现

对于深耕前端多年的工程师对架构肯定有一定的了解，如果你看过我之前的文章，相信你对架构有了基础的认识，本文将为大家提供微前端架构的实现方式的方法以及各种方式之间的对比，前端架构路上我们一起加油！！

微前端架构的实现方式Iframe

优势：

技术成熟；

支持页面嵌入；

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

劣势：

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

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

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

微前端架构的实现方式web component

优势：

支持自定义元素；

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

支持模板template和插槽slot，引入自定义组件。

劣势：

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

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

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

微前端架构的实现方式 自研框架

优势：

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

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

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

劣势：

技术实现难度高；

需要设置一套定制的通信机制；

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

最终选型--自研框架

路由分发式；

主应用控制路由匹配和子应用加载，共享依赖加载；

子应用做功能，并接入主应用实现主子控制联动。