什么是微前端及微前端优缺点

什么是微前端

微前端是一种类似于微服务的架构,它将微服务的理念应用于浏览器端,即将 Web 应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。各个前端应用可以独立运行、独立开发、独立部署。(建议先了解微服务

微前端的优缺点

优点

  • 可以与时俱进,不断引入新技术/新框架

前端技术栈日新月异,微前端可以在维护好遗留系统的前提下,不断引入新技术和新框架,提高开发效率、质量、用户体验。微前端可以很好的实现应用和服务的隔离,互相之间几乎没有影响,可以很好的支持团队引入新技术和新框架。

  • 局部/增量升级

对于许多组织来说,追求增量升级就是他们迈向微前端的第一步。对他们来说,老式的大型单体前端要么是用老旧的技术栈打造的,要么就充斥着匆忙写成的代码,已经到了该重写整个前端的时候了。一次性重写整个系统风险很大,我们更倾向一点一点换掉老的应用,同时在不受单体架构拖累的前提下为客户不断提供新功能。

  • 代码简洁、解耦、更易维护

微前端体系下,每个小模块的代码库要比一个单体前端的代码库小很多。对开发者来说这些较小的代码库处理起来更简单方便。而且微前端还能避免无关组件之间不必要的耦合,让代码更简洁。我们可以在应用的限界上下文处划出更明显的界限,更好地避免无意间造成的这类耦合问题。

  • 独立部署

就像微服务一样,微前端的一大优势就是可独立部署的能力。这种能力会缩减每次部署涉及的范围,从而降低了风险。不管你的前端代码是在哪里托管,怎样托管,各个微前端都应该有自己的持续交付管道;这些管道可以将微前端构建、测试并部署到生产环境中。我们在部署各个微前端时几乎不用考虑其他代码库或管道的状态;就算旧的单体架构采用了固定、手动的按季发布周期,或者隔壁的团队在他们的主分支里塞进了一个半成品或失败的功能,也不影响我们的工作。

缺点

  • 重复依赖

不同应用之间依赖的包存在很多重复,由于各应用独立开发、编译和发布,难免会存在重复依赖的情况。导致不同应用之间需要重复下载依赖,额外再增加了流量和服务端压力。

  • 团队之间更加分裂

大幅提升的团队自治水平可能会让各个团队的工作愈加分裂。各团队只关注自己的业务或者平台功能,在面向用户的整体交付方面,会导致对用户需求和体现不敏感,和响应不及时。

  • 0
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
SVG(Scalable Vector Graphics)和Canvas是用于在网页上绘制图形的两种主要技术。它们各自具有一些优点和缺点,下面是它们的特点: SVG的优点: 1. 矢量图形:SVG使用矢量图形,图像可以按比例缩放而不会失真。这使得SVG非常适合绘制图标、图表和其他需要高质量缩放的图形。 2. 声明性语法:SVG使用XML语法来描述图形,使其易于阅读、理解和修改。可以使用CSS样式和JavaScript来控制和交互SVG元素。 3. 可搜索性和可访问性:由于SVG是基于文本的,因此可以通过搜索引擎索引,并且对于屏幕阅读器等辅助技术也更友好。 SVG的缺点: 1. 复杂性:复杂的SVG图形可能会导致性能下降,特别是在处理大规模或复杂动画时。 2. 浏览器兼容性:尽管现代浏览器都支持SVG,但在某些旧版本的浏览器中可能存在兼容性问题。 Canvas的优点: 1. 像素级控制:Canvas提供了一个像素级别的画布,可以通过JavaScript直接绘制图形和动画。这使得Canvas非常适合实时绘图和游戏开发。 2. 性能优势:由于Canvas直接操作像素,绘制速度快,特别适用于大规模或复杂的动画效果。 3. 灵活性:Canvas可以处理各种类型的图形和动画,并且对于绘制和变换图形提供了更多的自由。 Canvas的缺点: 1. 无法缩放:Canvas中绘制的图形是基于像素的,所以在缩放时会有失真。如果需要高质量缩放,可能需要进行额外的处理。 2. 不支持事件处理:Canvas绘制的图形无法直接添加事件处理程序,需要手动编写JavaScript代码来实现交互。 综上所述,选择使用SVG还是Canvas取决于具体的需求。如果需要高质量缩放、可搜索性和可访问性,以及对于简单图形和图标的绘制,SVG是一个不错的选择。如果需要像素级控制、性能优势以及对于实时绘图和游戏开发的需求,那么Canvas更适合。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值