浅谈微前端

2020-11-15 本文已影响0人空无一码

微前端是一种类似于后端微服务的架构，它将微服务的理念应用于浏览器端，即将单页面前端应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。

它不是单纯的前端框架或者工具，而是一套架构体系，最早在2016年底被提出，最近两年才流行起来。

采用微前端的好处

在功能越来越多，依赖越来越负责的大型前端系统中，如果在项目初期没有很好地考虑后期兼容的灵活性、扩展性以及弹性，很容易出现项目难以维护或者谁都不想碰的尴尬场面，所以初期的设计很重要。

采用微前端，可以将新、旧技术构造的前端项目完美融合到一起，彼此构建，发布，运行等不受干扰。

微前端的优势：

Single-spa 是一个将多个单页面应用聚合为一个整体应用的 javascript 微前端框架。
https://zh-hans.single-spa.js.org/

Single-spa 从现代框架组件生命周期中获得灵感，将生命周期应用于整个应用程序。它脱胎于 Canopy 使用 React + React-router 替换 AngularJS + ui-router 的思考，避免应用程序被束缚。

现在 single-spa 几乎支持任何框架，它是很多微前端框架的基石，比如蚂蚁金服基于single-spa 的微前端解决方案qiankun。

single-spa 的原理：它相当于一个状态机，框架只负责维护各个子应用的状态，其中怎么加载子应用、挂载子应用、卸载子应用等，都由子应用自身控制，从而保持很好的扩展性。

它主要基于 single-spa 封装了非常多的能力，把我们在构建微前端系统中遇到的一些问题，如样式隔离、沙箱、预加载等等这些你需要的能力全部内置到了 qiankun 里面，所以这是一个比较完备的微前端解决方案。

特性