谈谈微前端
将多个独立的前端应用聚合在一起组成一个全新的应用,各个应用直接彼此独立,互不干扰
- 复杂度可控: 每一个UI业务模块可由独立的前端团队开发, 避免代码巨无霸, 保持开发时的高速编译, 保持较低的复杂度,便于维护与开发效率。
- 独立部署: 每一个模块可单独部署,颗粒度可小到单个组件的UI独立部署,不对其他模块有任何影响。 技术选型灵活: 也是最具吸引力的,在同一项目下可以使用如今市面上所有前端技术栈,也包括未来的前端技术栈。
- 容错: 单个模块发生错误,不影响全局。
- 扩展: 每一个服务可以独立横向扩展以满足业务伸缩性,与资源的不必要消耗
为什么需要微前端
- 如果前端项目过于庞大, 所有功能都在一个项目,而客户又比较多,每个客户需要的功能又差异,有的客户还需源码,按目前架构开发很难满足不同客户不同功能以及不同源码版本的业务需求,需要一种更高维度的解耦方案-微前端(前端微服务化),按业务拆分为不同的微前端模块
项目过于庞大会导致什么?
- 人力成本大
- 维护成本高
- 迭代成本高
- 需求变更影响范围大
微前端缺点
- 体验差,每个独立应用加载时间较长;
- 拆分的粒度越小,便意味着架构变得复杂、维护成本变高。
- 技术栈一旦多样化,便意味着技术栈混乱
谈谈qiankun
JS沙箱是怎么做隔离的
- qiankun 有
SnapshotSandbox【快照沙箱】,LegacySandbox【单例沙箱】 和ProxySandbox【代理沙箱】 这些沙箱
样式隔离
- qiankun的样式隔离主要分两种,
- 一种是从工程化的角度,利用Css Module,给每个选择器加上不同的类名,防止类名冲突;
- 还有一种就是利用浏览器的Shadow dom来进行严格隔离