文章目录
一、微前端的引入
现在企业微服务架构都是采用前后端分离的设计方式,后端也是通过微服务把项目拆分为多个小服务并独立部署。那么前端就要应对很多的后端服务,就有很多的api要管理,容易混乱,需要很高的沟通成本和技术要求。当服务出现变更的时候就要通知所有受影响的团队,需要较高的沟通成本。
微前端的引入很好的解决了以上的问题。
在前端设计时我们需要遵循单一职责和复用原则,按照领域模型和微服务边界,将前端页面进行拆分。同时构建多个可以独立部署、完全自治、松耦合的页面组合 ,其中每个组合只负责特定业务单元的 UI 元素和功能,这些页面组合就是微前端。
微前端和后端微服务的类似,都可以按照一定的规则拆分,重组,并可以独立开发、测试、部署、运维,以适应业务的快速变化和多团队平行开发的要求。
二、微前端的集成方式
我们看一下下面这个图,微前端位于前端主页面和微服务之间,它需要与两者完成集成。
1、微前端与前端主页面的集成
前端主页面是企业级的前端页面,微前端是业务单元的前端页面。微前端通过主页面的微前端加载器,利用页面路由和动态加载等技术,将特定业务单元的微前端页面动态加载到前端主页面,实现前端主页面与微前端页面的“拼图式”集成。
微前端完成开发、集成和部署后,在前端主页面完成微前端注册以及页面路由配置,即可实现动态加载微前端页