编程界“滥竽充数者”？React是否名不副实？

Z时代
2024-01-10
分类：综合

react

全文共3672字，预计学习时长11分钟

图源：Aphinya Dechalert提供

年初，笔者试着真正使用了一回React库。由于对Angular有一定的了解，笔者对库中提出的概念保持开放包容的心态。

一开始有点奇怪——在React中，一切都必须以特定的方式进行结构化，并使用自动化处理程序来处理数据流。在数据方面，React总有一套独有的强制单向数据流机制。

但这并非是令笔者对React避而远之的原因——真正令笔者苦恼的是社区里那些玻璃心的狂热信徒。也许是因为笔者拥有Angular方面的知识背景，为了了解React的运行方式，笔者进行了观察和比较，这不免让大多数只听说过React的人通过DMs气势汹汹地来找麻烦。

图源：Unsplash

几个月后，他们赢了，笔者重新退回到Angular的安全一隅。但最近，笔者有机会在工作中用到了React Native，以下是笔者对此事的真实看法。

结论

React是一个库

React是一个库——库是用来与其他库结合使用以解决特定问题的。React解决问题的方式在于呈现前端界面和管理频繁变化的数据。

React的优势在于单向数据流，在面对突变和意外继承时可以保持高度稳定性和可预测性。

React备受欢迎的另一大因素是其处理关注点分离（SoC）的方式。React颠覆了将CSS、JavaScript和HTML分隔成单独文档文件的传统筒仓（salio）方法，并将其放入一个空间，允许在单个空间内进行处理。

通过Angular演示的处理SoC的传统方法

当需要新的条件时，该结构不仅仅局限于Angular，FYI。

通过React实现基于关系的SoC

从理论上而言，基于关系的关注点分离可以通过Angular来实现，但它并不像React中所运用的默认的方法，也没有那么直观。

React之所以能够做到这一点，是因为其基本原理是将代码组件保持足够小，以便于检测和理解域和边界。但这并非一个硬性规则，代码组件的最终大小由开发人员决定。

回顾基础知识

React之所以备受欢迎主要是因为缺少必要的起步架构。在Angular中需要命令行界面（CLI）来为框架生成必要的设置，而React则与Angular不同，其所需准备工作更少。

然而，许多关于这方面的比较都会产生一些误解。React是一个库——这意味着它很小且极具针对性。然而，Angular是一个框架，这意味着它是同一个框架下的库集合。

所以，要说Angular的优势名副其实，这是不公平的。

框架决定开发代码的方式，并充当所有关联库的协调器。框架可根据一组原则或规则，确保各部分都按预期运行。这是非常必要的，因为当有多个需要同时运行的库时，就需要有一些共同基础以便程序良好运行。

React则并非如此。

React的设计目的并非在于此——因为其惟一目的就是在屏幕上呈现画面，并清晰地将数据连接到DOM（文档对象模型，Document Object Model）。这就是将状态管理委托给Redux的原因所在。这是为什么当不想处理数据和DOM时，就需要寻找其他第三方应用程序的原因。

这也没什么不对的。这就是React的运行方式，也是React的设计目的所在。

简单并不意味着更好

图源：Unsplash

关于Angular和React之间的争论似乎已持续良久。然而，这不是本质上哪个更好的问题，而是哪个最适合开发需求的问题。

大部分人的观点是Facebook创造了React。但从整体上看这并没有什么真正的意义。是的，React是由Facebook制作的，但是React并不是其使用的唯一技术。还有很多其他后端或前端技术。

如果沿着“出身”这条方向研究下去，那么这对Angular与谷歌、Java与Oracle、.Net与微软也同样适用。

React可能比Angular更容易上手——尤其是对于新开发人员来说，他们不了解前端代码。其可能是自学成才，也可能是经验丰富的工程师正在过渡到一个全新开发领域。

抛开技术水平而言，React相当于JavaScript刚推出时的版本——简单易用，而且使用方法基本没有限制。

作为库，React面临的问题是没有结构约束——只有语法约束。这可能导致解构应用程序缺乏命名约定、hapdangerous文件夹结构(若有)以及与生产部署中捆绑打包冗余文件。

从理论上而言，若没有严格遵守与代码不直接相关的编码细节部分，那么最终使用的任何代码都可能落得这个下场。

仍有必要了解实际的JavaScript以及其他一些知识

图源：Unsplash

React也是JSX——这是JavaScript的一大特点，这意味着开发人员仍然需要了解JavaScript的实际运行方式。

React比起Angular可能更接近于JavaScript，后者的结构更像是一种传统编程语言，通过TypeScript进行类型转换和控制。

这就是为什么开发人员需要对JavaScript的运行方式有深刻理解，才能成为一名高效的React开发人员。开发人员需要明确的其他内容包括状态和数据流的概念—因为这是React擅长处理的两个主要领域。

一旦超出了最初的待办事项应用程序的应用范围，架构模式和结构开始变得重要起来。做电商应用时，整个销售系统，包括单品推荐、交叉推荐和历史购买推荐的代码不能都塞进根文件夹里面。

这些是React教程中未涉及到的内容。事实上，大多数在线编程教程并没有真正讨论架构或结构，以及如何实现与框架或库相关的元内容。

虽然一旦编译完成，没有人会真正看到这些，但是开发伙伴或代码接手方遇到一团糟的代码无疑会抓狂。

React的优点

React是一个库，这意味着其是高度可移植的。在任何地方它都可以运行——这有点像jQuery和Ajax。

当涉及到处理微前端和在旧系统中始终存在的过渡应用程序时，这一特点益处多多。

其与React Native的关系也不同，且改变了渐进式web应用程序的制作方式。与其他基于javascript的框架(如Ionic)不同，这些框架本质上是围绕Angular、Vue或React代码来生应用商店就绪应用，React Native则更进一步，可将代码翻译成Apple和谷歌所需的实际原生语言。

因此，React Native不会把网站伪装成应用程序，而是将其变成了真正的应用程序——其整体性能更佳——其整体性能更佳，访问本地功能的方法也更好，比如地图、指南针、图像和设备上的摄像头等。

代码本身仍然主要是React，但是变成了适应各种移动设备的React版本。

React的缺点

作为一名深入到React领域的Angular原生开发者，笔者认为React最让人头疼的事情之一就是缺少对常用特性和功能的访问功能，比如数据自动绑定，以及如何仅通过将几乎所有基于javascript的库放入其中使其运行良好。

或者，使用Angular已经提供的可用库。唯一要记住的就是导入库。

但是，React更多的时候会依赖于第三方库，这些库之间或这些库与React之间可能相互配合，也可能适得其反。

此外，社区中也很少有关于组件设计和组件结构的讨论——或者是笔者没找对地方。随着项目的深入开展，开发人员经常会发现自己把状态推得比需要的更高，不经意就导致全局空间的污染。

Redux经常被用来解决这个问题，但是Redux并不是React，它完全是一个独立体。

图源：Unsplash

结语

值得注意的是，到目前为止，这些都只是笔者个人对库的一些看法。总的来说，这个社区一直都很不错，除笔者遇到的少数几个在Angular界中不常见的挑衅者。

那么，React是否名不副实呢?

这完全取决于所面对的是哪个圈子的狂热爱好者，一切事情都有其特殊之处。React并不是前端解决方案的终极圣杯，但它确实非常有用。

笔者也成为资深开发者，见证了许许多多项目的花开花落，现在开始学习新技术以便更新升级现有的知识体系——而不是就此止步。

React本身也不是什么新鲜玩意儿。它只是将JavaScript、HTML和CSS打包到一个空间中的另一种转换。Angular早在初始阶段就这么做了，而jQuery甚至更早。

这个行业总是在寻找下一个最好的开发框架，但是最好的方法就是学习正确地编码并把这一点做好——因为无论什么框架、库、脚手架或者其他新奇之物，现在都在这个社区占据一席之地。

作为一名开发人员，代码质量取决于能以多快的速度使良好编程的基础适配当前的需求和环境。

最后，感谢大家阅读~

推荐阅读专题

留言点赞发个朋友圈

我们一起分享AI学习与发展的干货

编译组：廖琴、齐欣

编程界“滥竽充数者”？React是否名不副实？

其他人也看了：