前端诸神大战,Vue、React 依旧笑傲江湖

2023-05-25 0 499

【萨德基】现如今的后端架构消费市场大体上由 React、Angular 和 Vue.js 占有。四种架构都有他们精辟的竞争优势,也有各别的瑕疵。所以,工程项目构筑架构时该怎样优先选择就可以获得更适宜的效用呢?且看责任编辑预测。

前端诸神大战,Vue、React 依旧笑傲江湖

  重新整理 | 弯月 白眉林 | 张文

  头图 | CSDN 浏览自Kunming

自 2010 年 AngularJS 第三版正式发布年来,后端架构的产业发展历经了六个十年间,后端架构混战也基本上就此结束。众所周知,那时大体上上是 React、Angular(主要包括 AngularJS 和而后的 Angular)和 Vue.js 两分四海。

所以 2021 年了,在遭遇新工程项目时,合作开发者该怎样优先选择呢?责任编辑将从如下表所示两个各方面较为四个架构,期望冀望你更上一层楼。

  大体上较为

  大体上重要信息:

前端诸神大战,Vue、React 依旧笑傲江湖

  各架构的优劣

React 由 Facebook 合作开发,第三版正式发布于 2013 年。Facebook 在他们的商品中大批采用了 React(如 Facebook、Instagram、WhatsApp 等)。现阶段平衡版为 16.x,正式发布于 2018 年 11 月。架构预设词汇为 JavaScript,但也全力支持 TypeScript。

  React 的竞争优势:

初学易用;采用 JSX 模版;文件格式完整;速率十分快,得力于交互式 DOM 和各式各样图形强化举措;对服务端图形全力支持十分好;全力支持 PWA;单向数据绑定;可采用 Redux 作为状态管理;全力支持函数式思想;易升级版;React 技能可以直接转移至 React Native。React 的缺点:

React 只负责 UI,其他架构需要合作开发者自行搭配(很难定义这是好是坏,许多合作开发者并不喜欢 Angular 这种大而全的架构);

  CSS 管理各方面依赖第三方(如 CSS Modules 或 CSS-in-JS),容易导致混乱;

React 正在逐步放弃 OOP 方式,这对传统合作开发者会导致一些学习障碍。Angular 由 Google 合作开发,首次正式发布于 2010 年,是四个架构中最为年长者。最初版(1.x)称为 AngularJS,采用 JavaScript,但在 1.5.x 之后进行了一次大规模重构,架构基本上重新设计,而后版改名为 Angular 2,一直延续至 2020 年 6 月正式发布的 Angular 10。Angular 预设词汇采用 TypeScript。

  Angular 的竞争优势:

Angular 本身构建在 TypeScript 上,因此对 TypeScript 的全力支持十分好;Angular Language Service 全力支持在外部 HTML 模版文件中采用自动完成;Angular 通过命令行程序提供新功能,如代码生成等;文件格式十分完整;单向数据绑定,可将意外错误减少到最低;MVVM 模型可让合作开发者采用同一套数据合作开发不同 UI 组件;依赖注入保证模块的独立性;代码结构和架构可扩展性强,适宜大型工程项目;“大而全”,Angular 架构包含了后端合作开发需要的方各方面面。(关于这点的好坏判定,见仁见智)Angular 的缺点:

众多不同结构(可注入组件、组件、管道、模块等)增加了学习难度,而 React 和 Vue 只有“组件”的概念;性能较差。Vue 是最年轻的架构,由前 Google 员工尤雨溪合作开发。尽管 Vue 是唯一没有任何大公司全力支持的架构,但过去几年内,Vue 的流行度还是大幅增加。现阶段稳定版为 2019 年 2 月正式发布的 2.6 版。预设词汇采用 JavaScript,正在合作开发中的 Vue 3 计划全力支持 TypeScript。

  Vue 的竞争优势:

增强 HTML,在这各方面 Vue 与 Angular 很相似;文件格式完整;适应性强。由于语法与 Angular 和 React 很相似,所以从其他架构迁移至 Vue 相对容易;可扩展性强。Vue 可用于合作开发大型应用程序;尺寸小。Vue 只有 80K 左右,比其他架构小得多。Vue 的缺点:

  资源缺乏。Vue 的消费市场依然较为小,所以资源也较少;过于灵活,在缺乏经验的合作开发者手中可能会造成一些风险。

  授权

优先选择开源架构时,授权是一个需要认真考虑的各方面。不过,幸好四个架构都采用了宽松的 MIT 授权,所以在这各方面不需要有太多顾虑。

React 曾采用 BSD+专利授权的方式,但在 2017 年,这个授权受到了许多合作开发者的质疑,因为该授权意味着 Facebook 理论上可以对任何采用 React 的公司提出专利诉讼。虽然 Facebook 自称这是一款“防御性”协议,但由于该风险的存在,许多大公司纷纷表示将从自家代码中剔除 React。而后 Facebook 迫于压力终于将授权改成了 MIT,这才平息了风波。

  流行度

前端诸神大战,Vue、React 依旧笑傲江湖

前端诸神大战,Vue、React 依旧笑傲江湖

而从 Googl

前端诸神大战,Vue、React 依旧笑傲江湖

就业各方面的情况则略有不同。在 Google 趋势上添加“

前端诸神大战,Vue、React 依旧笑傲江湖

另一张略早(2018 年末)的统计图也表明了同样的趋势。如下图,各大招聘网站上占有主导地位的依然是 Angular 和 React,甚至 Angular 还比 React 略多一些(注:这是两年前的数据)。

前端诸神大战,Vue、React 依旧笑傲江湖

m/blog/angular-vs-vue-vs-react/

综上可以得知,虽然 Vue 越来越流行,但许多公司为了平衡性起见,还是优先选择了久经考验的 React 架构。由于前几年 Angular 的流行,虽然那时很少有新工程项目采用 Angular,但熟悉 Angular 的合作开发者依然有消费市场,因为遗留的 Angular 工程项目依然需要有人来维护。

  性能

由于 React 和 Vue 都采用了交互式 DOM,两者在图形各方面的性能差距并不大。而 Angular 不采用交互式 DOM,它优先选择直接图形 DOM。

虽然采取了各式各样强化举措保证每次只有更改的部分才会图形,但相比之下图形性能还是比不上 React 和 Vue。

  在架构尺寸各方面,React 为 100k,Vue 为 80k,而 Angular 达到了 200k。所以加载速率上也是 React 和 Vue 更胜一筹。

  社区全力支持

React 和 Angular 都由大公司合作开发,文件格式十分完毕。同时,经过多年的积累,两者的社区全力支持也十分完善,合作开发中遇到的问题通常都可以通过社区搜索获得解决。

相比之下,Vue 由尤雨溪主导合作开发,Vue 的兴起也是近几年的事情,所以社区支持并不如 React 和 Angular 优秀。但最近 Vue 的社区也在变得越来越好。

  学习曲线

React 的核心部分很容初学习。但由于 React 依赖许多第三方库来处理其他后端功能,合作开发者需要学习各式各样不同的库就可以合作开发出完整后端应用。此外,React 并没有指定适宜合作开发的第三方库,因此合作开发者需要他们优先选择,这也就增加了初学者的学习难度。

相比之下,Angular 是一个“大而全”的库,提供了后端所需的一切,所以即便是初学者也可以放心采用 Angular 去合作开发出完整地应用程序。但是,Angular 本身就包含了许多难懂的概念,所以学习起来要比 React 困难。

而 Vue 相对来说十分容易。Vue 吸取了 React 和 Angular 的所有优点,所以合作开发者可以很容易地学习。

  跨平台

React 有一个子工程项目 React Native,可以利用 JavaScript 和类似于 React 架构编写原生的移动应用程序。React Native 也有多年产业发展历史,拥有大批实际应用。最重要的是,熟悉 React 的合作开发者不需要过多学习即可掌握 React Native。

对于 Vue,要想合作开发原生应用程序,可以采用另一款名为 Weex 的原生架构。

  还有一个名为 NativeScript 的跨平台架构,也可以合作开发原生移动应用,它全力支持 Vue 和 Angular。

  总结

对于有经验的合作开发者来说,优先选择哪个架构并不会有问题,因为三者的大体上思想都十分相似,从一个架构迁移到另一个架构也较为容易。

而对于初学者而言, React 无疑是最好的优先选择,它相对容初学习,应用广泛,而且能提供很好的工作前景。Vue 由于很容易入门,如果你已有一些后端的经验,期望学习一个新架构来快速合作开发一些工程项目,所以可以尝试一下 Vue。

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务