全国旗舰校区

不同学习城市 同样授课品质

北京

深圳

上海

广州

郑州

大连

武汉

成都

西安

杭州

青岛

重庆

长沙

哈尔滨

南京

太原

沈阳

合肥

贵阳

济南

下一个校区
就在你家门口
+
当前位置:首页  >  技术干货

为什么前端不能放弃React?

发布时间:2023-01-06 10:53:00
发布人:wjy

  昨天我学前端的表弟突然问我:哥,我可不可以不学React啊?我感觉Vue够用了!

  我**上去就是一B兜,还想不想好好干了?不想好好干前端,你就直说,还想放弃React,人家都是担心剑未佩妥,转身已是江湖。你倒好,剑都不带,直接杀上梁山!怎么?明知山有虎,偏向虎山行!那你也得看看自己叫不叫武松啊?大郎!是不是又该吃药啦?

  老弟,哥今年搞前端第9个年头,马上“前端九年义务教育”就要毕业,负责任的告诉你,react那可是前端赚大钱的标配。今天我就给你念叨念叨,为什么前端不能放弃React?

  1、 从市场流行度来看

  React是企业项目开发流行框架之一,不学React,等于自断一臂。现在市场上也就两个流行框架:一个Vue,一个React。其他的我们先不讨论。你上来先放弃一半,半壁江山。直接损失一个“汪峰”,难怪你上不了头条。之后我们全方位慢慢详细说······

  2、从大厂技术选型来看

  React 是大厂的选择,也是我们进大厂的选择。

  根据各公司招聘信息,梳理的60家公司项目开发,前端技术栈的框架使用情况。其中包括大、中、小厂的信息。从这些数据来看:

  1、Vue 和 React市场占有率大约各占 50%;

  2、一线大厂应用React居多,中小公司vue居多。

  你能想的出名字的大厂他们都在用React,阿里, 美团,腾讯,网易,百度,新东方,联想,新浪,滴滴,快手,哔哩哔哩,小米,美图,携程,这些大佬们都在用React,而且React的占比还不在少数!你告诉我你凭什么说要放弃学React?不想进大厂?不想拿高薪?谁跟钱过不去?如果过不去,那就是不够多!

  3、从薪资水平来看

  我们不说那些虚的,直接就是看一波薪资:

  北京 React 前端工程师工资收入:

为什么前端不能放弃React1

  北京 Vue 前端工程师工资收入:

为什么前端不能放弃React2

  通过查询的结果看,在北京,React 岗位的薪资是 Vue 岗位薪资的2倍,大家可以通过自己搜索来查询其他的城市情况。基本的情况是差不多的,这和 React 人才市场缺乏有很大的关系。

  没有一分钱的工资是白给的, 不学习 React 工资起点就低了。学了React工资直接翻一番!你自己看着办!

  4、从技术背景来看

  再说人家React的出身,React JS (以下简称React)基本上是一个由 Facebook 建立和维护的 JavaScript 库。妥妥的名门之后,稳稳的将相之姿。

  根据 React 的创建者Jordan Walke 的说法,React是一个高效、声明性和灵活的开源 JavaScript 库,用于构建简单、快速和可扩展的Web应用前端。

  自推出以来,它已经在前端开发领域掀起了一场风暴。跟迪迦一个级别(新的风暴已经出现,怎么能够停滞不前)。

  Stack Overflow 的最新调查也显示,React是最受喜爱的网络框架,而 Angular 在同一列表中排名第 9。

为什么前端不能放弃React3

  今天,有超过22万个网站使用React。不仅如此,像上面所调查的,阿里、快手、腾讯、字节、小米、网易、滴滴等,苹果、Netflix、Paypal等行业巨头也已经开始在其项目中使用 React。

  5、从技术本身来看

  说完出身,我们还得看看React这孩子本身的资质怎么样!

  既然有这么多大厂选择了React,那他肯定有无可比拟的优越性,来看。

  5.1、React 用于前端开发的主要优点

  让我们看看 React 的主要优点,了解它为什么从其他前端开发框架中脱颖而出。

  (1)速度

  React 基本上允许开发者在客户端和服务器端,利用其应用程序的各个部分,这最终提高了[开发过程](about:blank)的速度。

  简单地说,不同的开发者可以编写单独的部分,所有的改变都不会导致应用程序的逻辑。

  (2)灵活性

  与其他前端框架相比,React 代码更容易维护,并且由于其模块化结构而具有灵活性。这种灵活性反过来又为企业节省了大量的时间和成本。

  (3)性能

  React 在设计时就考虑到了提供高性能。该框架的核心提供了一个虚拟 DOM 程序和服务器端渲染,这使得复杂的应用程序运行得非常快。

  扩展阅读:[优化ReactJS性能的顶级技巧](https://www.peerbits.com/blog/top-performance-optimization-tips-for-react.html)

  (4)可用性

  如果你有一些基本的 JavaScript 知识,使用React是相当容易的。事实上,一个专业的 JavaScript 开发人员可以在三周内轻松地学会 React 框架的所有内涵和外延。

  (5)可重用的组件

  使用React 的主要好处之一是它有可能重复使用组件。这为开发人员节省了时间,因为他们不必为相同的功能编写各种代码。此外,如果在任何特定的部分做出任何改变,都不会影响应用程序的其他部分。

  同时,如果你认为React只适用于网页开发,那你就大错特错了! Facebook很早就已经升级了该框架,推出了 React Native,用于开发 Android 和 iOS 平台的移动原生应用程序。

  5.2、React 可以成为企业项目开发最佳选择的16个原因

  (1)它很容易学习

  React,与其他流行的前端框架如Angular 和 Vue 相比,更容易学习。

  事实上,这也是 React 在短时间内获得如此大的吸引力的主要原因之一。它帮助企业快速建立他们的项目。

  你看,学习某项技术或框架越难,开始开发过程所需的时间就越长。由于 React 是一个简单的框架,容易学习和开始,企业和大厂更倾向于使用它。

  (2)它有助于建立丰富的用户界面

  今天,一个应用程序的用户界面的质量起着重要的作用。如果用户界面设计得不好,那么它就会降低一个应用程序成功的机会。因此,建立丰富的用户界面对于一个应用程序的生存和发展是必要的。

  好消息是,React允许通过它的声明式组件来构建这种高质量的、丰富的用户界面。

  (3)它允许编写自定义组件

  React 自带 JSX,一个可选的语法扩展,这使得编写我们自己的组件成为可能。

  这些组件基本上接受 HTML 引用,也使所有子组件的渲染成为开发者的愉快体验。

  虽然关于JSX的问题有很多争论,但它已经可以用于编写自定义组件,构建大批量的应用程序,并将HTML虚拟结构图转换为 ReactElement 树。

  (4)它提高了开发者的生产力

  当一个应用程序具有复杂的逻辑,并且一个组件的单一修改会极大地影响其他组件时,频繁的更新往往会变成头疼。为了解决这个问题,Facebook 通过组件重用性功能扩充了 React。

  React 中的组件重用性,允许开发者重新部署相同的组件对象。

  这种方法提供了更好的代码维护和增长,因为React中的每个组件都有自己的内部逻辑,这很容易操作,因此,提高了应用开发的生产力。

  (5)它提供快速渲染

  当你建立一个复杂的、高负荷的应用程序时,在一开始就定义应用程序的架构是必须的,因为它可以影响你的应用程序的性能。

  简单地说,DOM模型是树状结构的。因此,在较高层次上的一个小修改会严重影响应用程序的用户界面。为了解决这个问题,Facebook 推出了一个虚拟 DOM 功能。

  虚拟DOM,顾名思义,是DOM的虚拟表示,允许首先测试对虚拟DOM的所有修改,以计算每次修改的风险。

  因此,这种方法有助于保持应用程序的高性能,并保证有更好的用户体验。

  (6)它对搜索引擎友好

  对于任何在线业务,搜索引擎优化是成功的途径。

  一般情况下,页面加载时间越短,渲染速度越快,应用程序在百度等搜索引擎上的排名就越高。

  由于渲染速度快,React与其他框架相比,大大减少了页面加载时间,这大大有助于企业在百度搜索引擎结果页上获得第一排名。

  扩展阅读:如何使用ReactJS构建快速和SEO友好的网络应用程序

  (7)它配备了有用的开发者工具集

  学习新兴技术,并在实际项目中使用它们既有趣又有益,但前提是要正确使用它们。

  Facebook 明白这一点,正是因为这个原因,他们在 React 框架中增加了 React开发工具 和 Chrome开发工具。

  这些React工具可以帮助开发者发现子组件和父组件,观察组件的层次结构,并检查组件的当前状态。

  (8)强大的社区支持

  像 Angular 一样,React 也有非常强大的社区支持,这是在我们的项目中采用 React 的主要原因之一。

  每天都有大量的 React 开发者,为使 React 成为更好的前端框架而贡献力量。目前,React 在 Github上已经获得了 200K 颗星,有 1,583 个固定贡献者。

  不仅如此,专家们还经常在视频网站上上传免费的 React 教程,并在互联网上撰写深入的 React 教程文章和博客。例如,在谷歌上简单搜索 "免费React教程",就能得到13,000,000 个结果。

  除此之外,React专家还经常在Stack Overflow 和 Quora 等QA网站上解疑释惑,这意味着如果你在使用React时遇到困难,你总是可以得到专家给出的可靠解决方案。

  (9)它提供了更好的代码稳定性

  React 遵循向下的数据流,以确保父结构不会受到其子结构的任何修改的影响。

  因此,每当开发人员对一个对象进行修改时,只需要修改其状态并进行适当的修正。这样,只有一个特定的组件会被更新。

  这种数据流和结构,结果是提供了更好的代码稳定性和应用程序的平稳性能。

  (10)它被许多财富500强公司使用

  仍然怀疑是否要使用React?

  看看一些鼓舞人心的React解决方案的例子吧。成千上万的公司,包括一些财富500强公司,都选择了React JS来做他们的网站和移动应用。

  Airbnb、特斯拉、阿里巴巴、腾讯QQ和沃尔玛都是使用 React Native 框架构建其移动应用的顶级品牌。

  另一方面,React网络框架目前正被包括阿里、快手、腾讯、字节、小米、网易、滴滴、Netflix、Paypal、NASA、BBC、Lyft和纽约时报等著名公司所利用。

  重点是,既然这么多成功的财富 500 强公司都在使用 React 和 React Native,那么React一定是真正有用的前端和移动应用开发框架。

  (11)优秀的数据绑定

  React 使用单向数据绑定和flux 架构,这是一个应用程序设计者,从一个点处理数据流。因此,任何人都有能力跟踪所有的变化,以改变数据的特定部分。

  (12)扩展你的工具和能力

  React 在一个项目中的主要好处是,开发人员可以在 JavaScript 和 Modem JSX 上写作。这种方法将允许他们在代码中使用HTML插入,这使得有广泛的机会进行重组,并提高完整的生产力。

  (13)测试和功能

  React 的结果不仅是性能,也是高度可测试的应用程序。它使开发一个明确的设计更容易,对测试友好。它们可以从触发的输出、函数、事件等方面进行监督。

  (14)以UI为重点的设计

  React 为任何 UI 布局提供了潜力。它允许重大的数据变化来自动转换特定的UI元素。由于这一最新功能,你不需要任何东西来更新UI。

  (15)它提供了一个独特的抽象层

  React 强大的一面是它提供了一个良好的抽象,这意味着它不会向用户透露任何复杂的内部信息。开发人员必须了解一些基础知识,并保留对内部功能的检查。

  (16)模板设计变得简单

  模板设计为开发人员节省了数小时的开发时间,并允许他们在create-react-app 完成开发环境的设置后迅速编写应用程序的代码。

  6、从框架对比上来看

  在目前的前端框架使用上,React 和Vue 无论在国内还是国外,都是应用比重最大的两个前端框架。

  那我们在框架使用上,该如何选择呢?我的观点是,没有一个框架是完美的,符合所有场景的框架,你去选择一个框架,不存在哪个框架是最好的, 或者是最不好的,只能选择一个最适合你的框架。

  6.1、从实际场景的特点,寻找最适合你的框架

  (1)关注团队新人技术成长的场景

  比如,你所在的公司项目开发流程已经很成熟了,产品也已经很成熟了,有一个比较稳定的状态,这个时候公司来了一批新人,当前也没有太多的功能需要开发,培养新人是一个最重要的目的,在这种背景下,比如你是一个leader,你可以让新人去做一些用 Angular 或 jQuery 这种框架型的产品,为什么做这样的技术选型呢?比如说 Angular 带有很多后端的设计思想在里面,一个新同学或者应届生进来,你能去看看Angular的代码,对增加后端的知识面是很有帮助的。再比如说你用jQuery开发,虽然它很老,效率也低,但不可否认 jQuery很多设计思想其实很有借鉴价值的,如果你能看看 jQuery 的这些工程,肯定对你了解框架的封装,语法的封装会有很大的帮助。在这个阶段,更应该选择贴近技术底层的一个框架,带有更多设计思想的框架。

  (2)关注安全、保密性场景

  比如军队、国企项目,这是一些很敏感的系统,这些系统可能没有办法使用Vue或React框架,你只能做一些框架的自研,这样自研的框架是符合安全和保密性要求的。

  (3)关注研发效率的场景

  本节讨论的重点是 React 和Vue 的比较,为什么企业项目研发多选择 React 或Vue 呢?因为应用这两个框架会大大提高研发效率。大家也不要会 React 就觉得 React 最好,会 Vue 觉得Vue 最好,听说其他的框架效率不高,就觉得它不好。其实,框架的选择没有好坏之分,只有适不适合你的项目场景之分。查理芒格,这位投资大师曾经讲过一个铁锤人的故事,不能手里拿着锤子,看什么都像钉子。我们不能手里拿着一个框架就说其他框架不行,这个思维一定要扭转一下。

  6.2、不同角度看 React 和 Vue

  React 和 Vue 从我个人角度看,做的都非常好了,不然整个业界也不会有这么多人用。但把它们两个放到一起,就免不了要对比,接下来我们从不同的角度来对React 和 Vue 各方面做个分析,分析的结果是,大家根据自己的场景特点,来选择你到底是用React 还是 Vue。

  (1)团队背书角度

  首先我们从 React 和 Vue 的团队背书看起。我们知道,Vue的团队主要是以尤雨溪为主的一个社区团队,而 facebook 是对React负责的,有一个大型的互联网团队来维护React。从这个角度看,谁有更好的背书呢?我们想象一下,如果你在一个大厂,一个40个前端的团队,大概有10个人左右做基础设施建设。Facebook 开发 React 也一样,他的配置只会比这个好,不会比这个差,几十个前端技术专家去研究一个框架,每天工作 8 小时,持续不断的思考这个框架如何设计,这就能充分的保障 React 的先进性,遇到新进行的理念,他们也会第一时间补充到 React 的技术体系里,所以 React 一定有一个充足的技术支撑。

  当然,Evan You 也是在全职保障Vue,但不可否认,Vue还是靠开源社区,Evan You 也招募了一些人做全职开发,但相对于React 这样非常专业的团队,人员上面我不认为它能比的上 React 这样的先进团队的持续输出,可能接近,但一定是有差距的。

  从这个角度来看,你去做一个项目,希望项目能不断的跟上前端技术的发展,React 相对Vue就有优势了,因为React团队背书更加强悍一点,Vue 靠开源社区,力量会薄弱一些。

  但如果你开发一个小型的项目,或者只是快速实现一个 DEMO 功能,一个不太复杂的项目,那背书的事情就不是你该考虑的问题了,因为一锤子买卖,实现完了就完了,或者说未来工程也不会发展到一个多么庞大的体系,你也不需要从这个项目上做很多的创新,这个时候硬考虑背书就没有意义了。但如果你的项目未来会非常大,会不断的应用新技术,顺滑的应用集成到你的项目里,这个时候React优势就凸显了。

  (2)从架构设计角度

  第二个我们从架构设计的角度来看React 和 Vue。Vue 架构设计有点类似于框架,框架是什么?举个例子,假如你去盖一栋大楼,框架就是把钢筋水泥柱子都给你做好,你只需要粉刷个墙壁,贴个瓷砖,这些装修的事你自己弄就行了。Vue 很类似与这样一个框架,它把骨架给你搭好,你去填肉就行了。比如Vue-router、Vuex、Vue unti-test 等等,官方都会给你提供好,你要做的就是拿过来直接写业务,这就是 Vue 框架设计的理念,也就是 Framework。

  React 官网把自己定义为一个前端的Library,它不是一个框架,我就是一个前端库,我这个库里提供必要的东西,至于你用这个库如何构建你的代码,或者说你想用这些砖头如何去垒你的房子,你自己来决定。比如说我想用这个库盖一个试用于自己的小房子,你完全可以用React 封装自己的 Router, 封装自己的数据流工具,封装自己的测试工具。当然,在大公司,你完全可以把它做成一个框架也可以。

  可见,Vue 的设计理念,它把自己设计成一个架子,把你约束在里面,但React的设计理念就是把自己做成砖头,你要不要撘成一个架子,你自己来决定,你如何开发你的房子,也是你自己决定。因此,React 相对于 Vue 来说更加灵活,Vue 相对于React,结构化会更强。

  从这个设计架构角度讲,再来看什么场景下适合使用 React,什么场景下适合使用 Vue。举个例子,你的团队都是菜鸟成员,这个时候不用想,肯定选 Vue,因为架子已经搭好了,让这些新人直接填肉就行,这个工程会很快的搭建出来,那这个时候你要选 React,就不合理了,因为这个时候需要有人来大家架子,要不要用数据流工具,到底该如何设计项目的架构,这样如果选择 React,工程架构体系反而不如 Vue。相反,你的团队成员能力非常强,你鼓励他们技术创新,不用多说,用React开放性更好,灵活度更好,会产生更多的 idea,提供更多创新的土壤。

  (3)从生态影响力角度

  最后从生态影响力角度,来分析一下React 和 Vue 的区别。在国内,React 和Vue 的影响力都不差,很多大厂也在用 Vue,像百度、小红书、滴滴、美团等公司都在用 Vue,像阿里,Airbnb 这些公司就在用 React。如果你的团队英文水平还不错,用 React 可能会更好,中文查不多资料,可以查英文,资料会很多。如果你中文很好,那就用 Vue,Vue的中文文档比React的中文文档写的要好,Vue 中文文档是一手文档,React 中文文档都是二手文档了。所以,你可以根据你团队的情况和你自身的情况再做框架的选型。

  (4)从性能的角度

  Vue 性能是优势,但 React 性能不是劣势,Vue 总体底层性能比 React 好一点点,这些对于一般项目来说可以忽略不计。值得一提的是,Vue 很多性能提升都帮你代劳了,你不需要手工做太多的性能优化,可React 不行,像 shouldComponentUpate, useMemo 等优化手段默认是不实装的,需要用户去自己优化,这样的好处使 React 使用更加灵活,你可以完整把控项目的性能,劣势也是优势。

  (5)从技术创新角度

  Vue 开发工程师技术上限很难突破,因为使用别人做好的架子,想做一些创新有点难,因为有时你会被框架约束死。比如你用Vue2.0就有这个体感,想使用TS,会受限与Vue框架的实现,TS就是没法很好的使用,直到Vue3出现才缓解了这个尴尬。React 不会存在这个问题,很多东西都可以和 React 拼接和组装,想做技术创新会非常容易。这就不难理解有些大厂为什么选择使用React 了,使用 React 更容易造一些轮子,更容易拿一些技术结果,更容易做一些有创意的东西了。

  五、总结

  1、没有一分钱的工资是白给的,不学习React 工资起点就低了(低一半)。

  2、跟随 Facebook 团队学习 React ,走在全球前端技术发展最前沿(背景牛)。3、React 拥有全球最完善的开发社区,技术问题借助社区可以轻松处理(有支持)。

  4、React Library 开放设计理念,提供给开发者最大的技术创新空间(能创新)。5、React 的大多数理念被其他框架借鉴,学习好 React,轻松上手其他框架(泛用性)。

  6、React 大厂面试必备技能,走上开发巅峰的强力敲门砖(有前景,有钱景)。

  说事实,讲道理, 好话都说尽了,你小子要是还想只学Vue,弃React于不顾,断送自己的大厂前程,葬送自己的美好钱途,就休怪为兄的无情,今天就给你安排一顿吃不了兜着走!

相关文章

做自媒体怎么找到自己的定位?怎么找到自己的定位?

2023-09-19

做自媒体选择哪个方向?从这几个方面去考虑

2023-09-19

自媒体新手需要怎么做?注意事项介绍

2023-09-19

新手做自媒体选择什么领域好?这几个领域适合新手

2023-09-19

带货直播间主播开场白话术怎么说?有哪些话术?

2023-09-19

当直播间没人说话主播怎么办?要怎么办?

2023-09-19
在线咨询 免费试学 教程领取