当前位置: 首页 > news >正文

微前端个人理解与简单总结

最近一段时间在学习微前端,一开始是看各种博客了解微前端含义、对比多种微前端框架优劣,最后选择了qiankun、micro-app、wujie这三种微前端框架进行深入研究、对比。

微前端框架

推出时间

官方文档易读性

社区讨论活跃度

配置难度

Qiankun(蚂蚁)

2019年

Micro-app(京东)

2021年

Wujie(腾讯)

2022年

Qiankun:

我研究、配置的第一个微前端是qiankun,根据qiankun官方文档可以成功搭建Vue主子应用以及react子应用,但文档中配置项层级模糊且对应示例比较片面,好在网上博客、文档多。如果注册了某个子应用,但没有启动的话会报错。

Micro-app:

micro-app官方文档描述清晰,配置过程简单,是我花费时间最少的微前端。如果注册了某个子应用但没有启动的话不会报错。

Wujie:

可以说wujie给我最大的感觉是文档混乱、步骤不清晰、容易误导人,网上相关的博客、文档很少,翻来覆去内容都很相似,参考意义不大。花了半天搭建、配置Vue主子应用还是没能成功。

微前端的应用场景:

  1. 当不同的团队开发同一个应用,所选技术栈不同时;
  2. 现在大型的互联网公司都会为用户提供很多应用和服务,通过微前端可以将多个前端聚合在一起,为用户呈现一站式服务的应用聚合应用。
  3. 需要保持技术栈不落后,就需要在兼容原有系统的同时,使用新框架去开发新功能,而遗留系统的功能已经足够完善且运行稳定,此时没有必要使用新的框架去重构遗留系统;
  4. 某个模块可以被多个项目之间共用;
  5. 为了使系统可以更快速地从故障中恢复或者不因为其中一个模块影响全局。

使用微前端的优缺点:

  1. 如果一个项目很大,我们更改了一部分代码,到发布的时候,就不用整个项目重新打包编译发布了,可以大大节省时间。还有一种情况:我们需要长时间下架、修改某个模块时,不用专门把这个模块代码去掉,它不会影响其它非相关功能线上正常使用。也意味着可以将故障风险的粒度隔离到更小的范围,更容易排查到问题所在;
  2. 微前端支持多种前端框架,可以让“新”应用与"旧"应用并行工作,从而提供了一种迁移手段;
  3. 多个独立的开发团队更容易协同开发单个前端应用,且职责范围更窄,更加易于理解;
  4. 通信比iframe容易(如可以共享cookie、session),浏览器刷新不用重新加载全部资源且url同步,但它样式隔离不够彻底,可能需要额外调整;
  5. 各个团队需要建立维护自己的服务器,构建流程和持续集成的管道,可能还加载冗余的js/css,小型项目或者功能简单的项目没有必要用微前端;
  6. 使用微前端且使用不同数据库的情况下,后端团队有独立的数据库,团队之间需要定期复制数据,一旦出现错误,容易引起数据不一致;
  7. 使用微前端意味着系统拆分,拆分的粒度越小,维护的成本越高;并且如果应用不同技术栈,技术栈种类越多,维护的难度越大。
http://www.lryc.cn/news/253018.html

相关文章:

  • PC端企业微信hook协议开发,获取要群发的客户群id
  • RabbitMQ安装说明
  • scrapy的建模及管道的使用
  • Hadoop学习笔记(HDP)-Part.04 基础环境配置
  • 【Linux】进程控制--进程创建/进程终止/进程等待/进程程序替换/简易shell实现
  • 用pip更新、安装python的包
  • spring boot 事件机制
  • 分布式版本管理系统---->Git(Linux---centos(保姆式)讲解1)
  • B树你需要了解一下
  • MFC设置状态栏文本导致崩溃的原因
  • 配置typroa上传图片到gitee
  • java并发-线程生命周期
  • Javaweb之Vue路由的详细解析
  • 力扣:196. 删除重复的电子邮箱(Python3)
  • Ruby和HTTParty库下载代码示例
  • Unity 使用Horizontal Layout Group和Toggle制作多个水平开关按钮实现自动排列和单个点击放大后的自动排列。
  • Python实现FA萤火虫优化算法优化BP神经网络回归模型(BP神经网络回归算法)项目实战
  • 灯塔ARL-NPoC全面教程
  • λ表达式、智能指针
  • PHP基础知识和操作
  • 系列十三、SpringBoot的自动配置原理分析
  • soapui报错: CXF directory must be set in global preferences
  • Netty02-基础概念
  • 计算机毕业设计 基于SpringBoot的敬老院管理系统的设计与实现 Java实战项目 附源码+文档+视频讲解
  • 精调llama模型
  • 【C语言】深入理解C语言中的数学运算和类型转换
  • 基于javaweb的宠物服务商城系统设计与开发
  • LeetCode-470. 用 Rand7() 实现 Rand10()【数学 拒绝采样 概率与统计 随机化】
  • 通达信指标公式19:龙虎榜股票池——主力控盘度的计算方法
  • 手搓图片滑动验证码_JavaScript进阶