React vs Vue：谁是2022年的最佳框架？

作者：Ashika Elza来源：51CTO技术栈

【51CTO.com快译】

作者丨Ashika Elza

译者丨布加迪

策划丨云昭

应该使用哪种 JavaScript 框架：React 还是 Vue.js?新的 WordPress 编辑器基于 React，而 Vue.js 是 Laravel 社区的流行框架。

开发界两种最流行的前端 JavaScript 框架是 React.js 和 Vue.js。React 是一种声明式编程语言，通过虚拟 DOM 与 HTML 文档进行交互。

React 和 Vue 都为软件开发人员提供了一种实用的方法来开发各种在线应用程序，但各自有一套最佳实践，适合不同的业务需求。

Vue.js 简介

Vue.js 是一种开源 JavaScript 前端框架。单页应用程序和用户界面是使用模型 - 视图 - 视图 - 模型架构构建的。

Evan You 开发了 Vue.js，它使用“高解耦”，允许 Vue 开发人员逐步创建用户界面。

Vue.js 是一种用于创建用户界面的复杂框架。

与其他整体式框架不同，Vue JavaScript 是从头开始构建的，逐步得到采用。

Vue 框架的主要库完全专注于视图层，易于学习，与各种库和现有项目集成。

与配套库和现代工具结合使用时，Vue js 还完全能够支持优雅的单页应用程序。

Vue.js 的功能特点

1、组件

Vue.js 组件是该框架最重要的功能之一。它们用于封装可重用的代码，并补充基本的 HTML 组件。在 Vue.js 应用程序中，您可以构建可重用的自定义元素，然后可以在 HTML 中重用。

2、模板

为了将显示的 DOM 连接到 Vue 实例数据，Vue.js 包含基于 HTML 的模板。所有 Vue 模板都是有效的 HTML，可以被浏览器和符合标准的 HTML 解析器解析。Vue.js 将模板编译成 Virtual DOM 渲染函数。Vue 在更新浏览器之前在虚拟 DOM 内存中渲染组件。如果您改变应用程序的状态，Vue 可以找到需要重新渲染的最少数量的组件和最少数量的 DOM 操作。

3、反应性

Vue 具有反应性框架，可通过使用简单的 JavaScript 对象来优化重新渲染。在此过程中，每个组件都跟踪其反应性依赖项，因此系统确切地知道何时重新渲染哪些组件。

4、路由

Vue 使用官方路由器通过 URL 路由用户。

单页应用程序(SPA)无法将连接分区到单个网页内的特定子页面，这是最常见的缺陷。

由于 SPA 仅向用户提供来自服务器的面向 URL 的单个响应，因此将特定的屏幕加入到书签或将链接分配给特定区域就算不可能，也很困难。

为了解决这个问题，一些客户端路由器使用“hashbang”(#!)来限制动态 URL。

5、转换

从 DOM 中更新、插入或删除对象时，Vue 提供了多种技术来运用转换效果。这包括以下工具：

使用 JavaScript 在转换 hook 期间立即更改 DOM。同化 Velocity.js 第三方 JavaScript 动画库。机械地运用 CSS 动画和转换类。应使用第三方 CSS 动画库 Animate.css。

React 简介

React 是一种 JavaScript 库，可用于创建 Web 应用程序界面。通过重用组件，React 或者 ReactJS 帮助为其产品开发更好的框架。ReactJS 由两部分组成：HTML 代码和 HTML 文档。HTML 代码用于创建用户视图层，又叫用户界面(UI)。所有组件都包含在 HTML 页面上。

React 由 Facebook 软件工程师 Jordan Walke 开发。2011 年，React 诞生。另一方面，React 在设计时考虑到 Facebook。React 库在创建网站和应用程序时派得上用场。Whatsapp 和 instagram 是最有名的两家采用 React 的公司。因而，React 在 2013 年向公众发布。

React 的功能特点

1、简单

React 理解和实施起来简单得多。因此，任何使用过 JavaScript 的开发人员都可以快速上手 React，开始开发 Web 应用程序。

2、可重用元素

代码的可重用性是 React 最重要的功能之一。可重用性使开发人员的工作变得轻松。程序员不需要为相关的应用程序组件构建单独的脚本。因此，可重用代码。因而，代码可重用性有助于降低制造成本。

3、简易的代码测试

测试是 React 的另一个重要方面。它随带的原生工具使测试和调试变得轻而易举。ReactJS 基于组件的架构减少了所需的调试工作量。更改应用程序的一个组件并不影响其他组件。因此，React 在测试和故障排除方面节省了大量时间。

4、对 SEO 友好

使用 ReactJS 加快了网页的创建。React 应用程序加载页面的速度比其他类型的应用程序快得多。因此，React 页面的跳出率很低。此外，React 的组件(比如 React Helmet 和 React Router)有助于开发对 SEO 友好的应用程序。

Vue 与 React

Vue

React

开源框架

库

Vue 由 Evan You 开发

React 由 Facebook 开发和支持

min+gzip 后，Vue 大小约为 20 KB

React 大小约为 100 KB

Vue 使用与 React 相似的虚拟 DOM 和操作型原则。然而说到组件更新和创建，Vue 更快速。

React 采用虚拟 DOM，这是不依赖 Web 浏览器的对象模型。该框架机械地呈现 HTML 页面。

Vue 可用于构建旨在轻盈快捷的小型

网页应用程序。

React js可用于构建基于社区的平台，比如应用市场和论坛。

结语

React 和 Vue 都是创建交互式用户界面的优秀技术。您在决定哪一个最适合项目时，要考虑诸多变化因素，包括贵公司的需求、特定用例、开发人员可用性、环境、时间表和预算。

Vue.js 似乎采用了 React 中引入的许多概念，并加以完善和改进。一些人认为，Vue.js 学起来较易入手。它在 Laravel 社区似乎大受欢迎，我认为 Vue 3 的发布对于 Vue.js 爱好者来说将是重大事件。我认为，Vue.js 有强大的社区，但与 React 没法相比。

原文链接：

https://www.datasciencecentral.com/profiles/blogs/react-vs-vue-which-is-the-best-framework-in-2022

会议推荐

近年来，“大前端”领域不断拓展和深化。为了更好地适应新的产品形态和用户需求，大量新的技术理念、技术标准、技术工具不断涌现。这些新技术让开发者面临前所未有的机遇和挑战。2022 年 4 月 9 日至 10 日的 WOT 全球技术创新大会“大前端新技术实践”专题中，多位大前端领域知名技术专家将聚焦大前端前沿技术，分享他们对新技术的探索和落地实践经验。

【51CTO译稿，合作站点转载请注明原文译者和出处为51CTO.com】

原文地址：https://www.toutiao.com/article/7047661493201961480/