为什么 React JS 比 Angular 或 Vue JS 更好？

众所周知，网页主要使用 HTML、CSS 和 JavaScript 编程语言（网络的三个基本构建块）构建。 具体来说，HTML 在网页上创建元素，例如菜单、文本和框。 而 CSS 用于设计、设计和放置这些元素在网页上。 最后是 JavaScript，它促进了与这些元素的交互和操作。 我们讨论的主题将围绕 JavaScript； 特别是 React.Js 及其优于 Angular 和 Vue.Js 的优势。

总之，React JS 比 Angular 或 Vue JS 更好，因为它具有卓越的虚拟 DOM 功能、强大的社区支持、丰富的文档、轻量级的属性、易于管理的学习曲线，以及它允许​​使用 React Native 的移动功能的灵活性。

JavaScript：胶水语言

为了为我们的案例设置优先级来证明 React 的主导地位，我们将回顾一些基础知识。 JavaScript 通常被认为是一种胶水语言，用于组装其他组件。 在三个 Web 构建块中，HTML 和 CSS 不太复杂（尽管主要用于静态设计）。 然而，对于创建动态 Web 内容的开发人员来说，JavaScript 是一个优先事项，这说明了为什么它比同时代的软件更大、更复杂。 本质上，成为大多数网页上使用的事实上的标准。

因此，在过去十年中，在 JavaScript 之上设计了多个前端框架，以简化网站的开发和维护。 结果，截至 2020 年，这些前端 JavaScript 框架中最受欢迎的是 React 和 Vue，然后是 Angular。

因为我们已经简要地确定了 JavaScript 和基于 JavaScript 的框架和库是 Web 开发的关键工具。 所以，为了给我们的博客设置上下文，让我们简要回顾一下 JavaScript 的历史和发展。

Web 技术和浏览器的历史

第一个 Web 浏览器于 1990 年 12 月开发并发布，Tim Berners-Lee 担任首席开发人员。 他同时开发并发布了超文本传输​​协议 (HTTP)，这是用于万维网索引和网站导航的应用协议。

后来，首个图形 Web 浏览器 Mosaic 于 1993 年发布。同样，同年，开发了 HTML。 这是在 JavaScript 诞生之前几年，而 CSS 是在 1996 年发布的，比 JavaScript 晚了一年。 这三种语言后来形成了一个著名的技术堆栈，被称为“Web 开发人员必须学习的三重技术”。

JavaScript 的发展

Mosaic 浏览器的著名后续产品之一是 1994 年发布的 Netscape Navigator 浏览器。1995 年，当时流行的 Netscape 的开发人员聘请程序员 Brendan Elch 为网页创建一种新的动态脚本语言和客户端的数据操作。

为了应对市场，Netscape 看到了创建动态网站的必要性，而不是局限于 HTML。 不幸的是，大多数早期网站只使用 HTML，因此计算效率低下。 因此，Netscape 不得不设计一种针对 DOM（文档对象模型）操作的简单 Web 脚本语言。 因此，该项目受到 Java 的功能和语法的启发—— 尽管它们在句法上有细微的相似之处，但它们有着根本的不同。

JavaScript 于 1996 年 3 月正式发布，最终在网页上启用了 HTML 单独无法实现的新功能。 例如，响应用户输入、显示弹出窗口和更改元素颜色。 Netscape 后来被同样拥有 Mozilla 的美国在线 (AOL) 收购，这促成了 JavaScript 作为互联网标准的指数级增长。

XML、AJAX 和单页应用程序的出现

在 2000 年代初期，Web 用户对缓慢的服务器响应和较长的数据传输时间感到沮丧。 标志着这个时代的低速互联网连接进一步加剧了这些问题。 导致了 AJAX 技术栈（异步 XML 和 JavaScript）的发展

在这方面，XML 是一种类似于 HTML 的标记语言，尽管它用于数据表示而不是内容显示。 随着 AJAX 堆栈的创建，XML 在 JavaScript 中变得相关。

AJAX 通常被描述为多种技术的集合，它们捆绑在一起作为一个整体，由 XHTML、CSS、DOM、XML、XLST、XML HttpRequest 和 JavaScript 组成。 在 AJAX 中，JavaScript 将所有其他工具绑定在一起。 因此，AJAX 提供了一种无需下载整个内容即可更新部分 HTML 页面的方法。

单页应用程序

一般来说，所有的 JavaScript 框架都采用单页应用原则。 在实践中，单页应用程序 (SPA) 是由单个组件组成的应用程序，在第一次访问时加载到内存中，然后可以独立替换或更新，因此不必重新加载整个网页在每个用户操作上。

此外，使用 SPA，可以重用组件，从而大大减少所需的代码量。 第一个单页应用程序于 2002 年实现，JavaScript 旨在作为实现的目标语言之一。 单页应用的成功，主要得益于前面的 AJAX 技术及其在服务器通信方面的优势。

JavaScript-HTML 关系

HTML 可以作为 JavaScript 的补充，就像 jQuery 一样； 或者作为被编译成 HTML 元素的集成的、类似 HTML 的语法。 JSX 语法就是一个例子，推荐在使用 React 开发时使用。 它既不是纯 JavaScript 也不是 HTML，而是两者的融合。 因此，从根本上说，将 HTML 的基本元素创建和结构功能与 JavaScript 的动态功能相结合。

CSS-HTML 关系

CSS 通常与 JavaScript 结合使用。 传统的示例格式是在单独的 .css 文件中实现 CSS 属性。 另一种格式是通过 CSS-in-JS 和 styled-components 等专门的库将 CSS 集成到 JavaScript 框架本身。 此类库使开发人员能够编写 JavaScript 代码，以使用类似 CSS 的语法来设置视觉元素的样式，然后通常在浏览器中将其编译成纯 CSS。

JavaScript 服务器端实现的出现

最终，2009 年发布了 Node.js，这是一种 JavaScript 的服务器端实现。 Node.js 将 JavaScript 域扩展到后端，使 JavaScript 成为一种全栈语言。

Node.js 是目前使用最多的 JavaScript 运行时环境，用于在 Web 浏览器环境之外执行 JavaScript 代码。 利用服务器端功能，Node.js 的创建者旨在开​​发一种更有效的替代当时流行的 Apache HTTP 服务器（通常与 PHP 一起使用）。 Node.js 是使用 Google 的 V8 JavaScript 引擎创建的，该引擎本身是使用 C++ 构建的。

前端 JavaScript 框架

既然我们已经奠定了基础，我们现在可以铺砖并深入研究我们倾向于 React.js 的原因。

框架与库

在谈论这个 JavaScript 三重奏时，一个常见的论点是什么是库。 具有讽刺意味的是，React 有时被称为库，有时也被称为框架。 但是，为了清晰和一致，将框架与库分开通常很有用。

特别是，库是非易失性资源的被动集合，开发人员可以控制如何使用这些资源。 它们通常非常简单，只执行一项特定任务，因此可以归类为工具。

虽然框架被设计成不那么被动，并迫使开发人员通过利用骨架进行开发并强制执行控制流来以某种方式做事。 例如，为开发人员提供了一种已定义的方式来开发和设置整个 Web 应用程序。 虽然 Web 应用程序库没有，而是提供更简单的子域操作，例如网络请求或样式操作。

尽管 Vue 和 Angular 在技术上被认为是框架，但对于 React 是框架还是库仍然存在一些分歧。 尽管 React 的原始开发人员将其称为库，但它仍然更常用作框架。

为什么 React 是主要的替代方案！

事后看来，React 是作为 XHP（Facebook 创建的 PHP 库）的 JavaScript 端口开发的。 通常，XHP 是对 PHP 的修改，允许创建自定义组件，旨在防止恶意用户攻击。 后来在这个 JavaScript 移植项目中发展出了 JSX（JavaScript XML），它成为 React 的通用标准语言。

考虑到所有因素，React 的范围比它的同行更窄，只呈现应用程序用户界面。 然而，它保持了轻量级结构的优势，因此学习和使用成本更低。 话虽如此，它仍然可以被视为一个框架，因为它的用途与 Vue 和 Angular 相同。

卓越的虚拟 DOM 功能。

React 是第一个根据 DOM 优化其功能的框架。 这是其成功的一个促成因素，因为 DOM 操作在使用的计算资源方面非常昂贵。 具体来说，React 旨在通过使用直观的状态管理和虚拟 DOM 来控制这种操作，从而尽可能少地执行 DOM 操作。

这种对虚拟 DOM 的利用使 React 更新更快，但代价是占用更多内存。 并且为了对浏览器 DOM 执行快速更新，react 在内存中维护了一个虚拟 DOM 树的副本，这会消耗额外的内存。 因此，React 的流行催生了许多衍生库，例如用于移动开发的 React Native。

单向数据流

在 React 中，数据是向下流动的，被称为单向数据流。 虽然 Angular 和 Vue 的双向数据绑定使代码更漂亮、更简单，但 React 弥补了卓越的可管理性和性能。 我们的论点有一个显着的优势。

为什么 React 比 Angular 更好

让我们逐案比较以获取更多上下文，好吗？ Angular 旨在用于大型应用程序开发，在编程功能和文件大小方面是一个功能更全面的 JavaScript 框架。

然而，与 React 相比，Angular 具有负面的臃肿、复杂和沉重的开发风格特征。 建议用于较小的开发项目，并被认为具有陡峭的学习曲线。 更糟糕的是，AngularJS 不再处于积极开发中。

Angular 完全使用 TypeScript 构建，需要大量代码，这使得它有点复杂。 相反，React 相当“简单”，它最初的定位是专注于控制和操纵视图。 从本质上讲，它允许开发人员准确地选择他们需要的东西，而且它还可以使用大量的第三方包。 因此，与 Angular 相比，React 并没有包含很多开销。

为什么 React 比 Vue 更好

Vue.js 由 Google 员工 Evan You 创建。 Evan 受到 AngularJS 的启发，但想创建一个更精简、改进的版本。 尽管 Vue 具有轻量级的属性、出色的性能和良好的编程风格，但 Vue 的缺点是笨拙。这正是 React 的优势所在。

例如，与 React 相比，Vue.js 中没有明确的最佳实践，这可能会使主要应用程序难以维护。 然而，React 的最佳实践可以在社区中找到。 例如，可以通过官方的 create-react-app 包创建可行的工作流。 由于以上几点，React 适当地提供了编写和维护大量复杂代码的能力。

ES6 语法

此外，开发人员也可以在 Vue 中使用 ES6 语法，但是在这方面，React 比 Vue 设计得更优化。 虽然 Vue 当前提供 TypeScript 支持，但它的支持并没有像 React 那样在单个命令中使用 CRA（创建 React 应用程序）和 TS 支持。 此外，使用 Vue，我们仍然需要一些带有自定义装饰器和特性的第三方包来创建一个真正的、完整的 TypeScript 应用程序。 不幸的是，官方文档并未提供入门所需的所有信息。 React 的另一个优势！

当我们巩固我们的论点时，让我们使用更清晰的某些基准进一步分解讨论。

1. 框架大小

虽然 npm 注册表中框架的缩小包的大小不太可能阻止或鼓励任何开发人员选择框架，但它仍然可以帮助我们的论点。 Angular 明显比其他的（187.6 kB）大很多，而 React 为 6.4 kB，而 Vue 介于两者之间，为 63.5 kB。

通常，包大小比较表明 Angular 支持并包含更广泛的功能，而 React 是为更简化的开发而设计的。 因此，React 的性质为开发人员提供了更少的选择来提高效率，这对于小型项目来说非常方便。

此外，与 React 或 Vue 相比，Angular 的复杂结构会导致性能不佳的潜在风险，尤其是在内存分配方面。

2. 开发经验、学习曲线和可用性

一般来说，TypeScript 本身并不比 JavaScript 更难或更容易学习。 但是，与 JavaScript 相比，它的使用并不广泛，并且包含的​​库和整体文档更少。 这些因素，再加上语法上的差异以及习惯于使用稍微不同的 JavaScript 进行编码所需的时间，为 React 提供了相对于 Angular 的轻微优势。

3. 基于语言的情况

另一个关键点是 React 和 Vue 使用 JavaScript ES6 作为它们的基础语言。 ES6 是自 2015 年以来最新的 JavaScript 行业标准。另一方面，Angular 1 利用 JavaScript ES5，这是以前的版本，而 Angular 2 依赖于 TypeScript。

尽管 TypeScript 使开发人员能够摆脱传统的 JavaScript 编程格式，但它的用户社区有限。 这意味着如果出现另一个新的 JavaScript 语法严格超集，TypeScript 可能会消失。 相反，JavaScript ES6 不会很快消失，因为它是当前用 JavaScript 开发的行业标准。

4. 文档

老实说，所有这些框架的文档可用性都令人满意。 也就是说，仍然值得注意的是，React 的文档以最多的语言提供（16 种）。 Vue 落后，有 8 种语言的文档，而 Angular 文档有 4 种语言。 React 文档是连贯的，并且在为不同的开发人员交付时具有统一的理论。

不幸的是，Angular 的框架情况可能会给开发人员带来一些困难，因为它分为 AngularJS 和 Angular 2。此外，“Angular”这个词有时会在它在在线上下文中指代哪个框架时变得模棱两可。 特别是在浏览较小的网站和较短的答案时。

5. 社区支持

在大多数情况下，React 可以说是目前所有 JavaScript 框架中最大的社区支持。 其讨论论坛和聊天室的广度就是例证。 此外，用户可以关注最新消息并参与 Facebook 和 Twitter 上的讨论。

Svelte 框架（荣誉奖）

我们认为在 JavaScript 领域提及一个相对较新的入口是明智的。 Svelte 由 Rich Harris 开发，最初于 2016 年发布，在 2019 年广受欢迎。它引入了 JavaScript 的多项增强功能，例如更改本地状态处理。

还值得注意的是，Svelte 没有虚拟 DOM，并且在构建时而不是运行时将编写的代码转换为 JavaScript。 本质上，它避免了将声明性元素转换为真实的 DOM。

概括

尽管 Vue 在 Github 上的 star 稍多一些，但 React 仍然更胜一筹，没有明显的弱点，并且具有更好的性能优势。 从本质上讲，更好的性能意味着更短的加载时间和更高的用户满意度。 此外，对于商业网站，这会导致收入增加，因为加载时间减少几毫秒可以增加用户交互和保留。

最终，JavaScript 框架格局的未来很难预测。 尽管有证据表明，在可预见的未来，React 可能仍然是主导框架。 但是，对于希望使用成熟的、受良好支持的、具有出色性能和大量文档的框架来开发应用程序的开发人员来说，React 是最佳选择！