vlambda博客
学习文章列表

React VS Angular:前端巨头的冲突

 发现关于这两个JavaScript 前端巨头的最重要的故事。


如今,几乎一半的基于JavaScript 的前端项目都是使用这两个庞大且公认的框架编写的。Web 开发世界在很大程度上依赖于这项技术,如果你没有听说过它们,你就不能认为自己是真正的开发人员。因此,在本文中,我们将展现关于这两件令人难以置信的艺术品的故事。



01

React

React 是一个 JavaScript 开源前端库,由 Meta(创建时为 Facebook Inc.)于 2013 年开发,由其创建者、热情的开发人员和开源爱好者维护。React 是最受欢迎的 GitHub 库之一,并且肯定是 JavaScript 库中最著名的。


刚开始时,Facebook 使用 C++ 开发和扩展他们的前端应用程序,速度很快,但是为了测试代码库中的每一个微小变化,工程师需要编译代码,并且需要花费巨大的时间时间,所以这是一个糟糕的解决方案。


因此,他们决定使用 JavaScript,并构建一套强大的指令来使所有流程更加敏捷和愉快。他们做到了,他们创建了 React,这个库将成为最著名的库。


Facebook 没有给出这个名字的官方动机,但有些人认为这是对当时唯一强大的前端框架 Angular 的反应。



02


Angular

Angular 是一个带有 MIT 许可证的开源前端开发框架。第一个名为 AngularJs 的版本于 2010 年发布,主要由 Google 开发。经过几年的经验和发展,以及像 React 这样的竞争对手的成长,谷歌发布了第二个版本,称为 Angular2。


Angular 是用 TypeScript 编写的。这可能就是 Angular 如此出色地支持 TypeScript 的原因。它也是对 Bootstrap 支持最好的框架,因此您可以使您的页面更具响应性。



03


来自社区的数据


根据 stackeoverflow.com 的 2021 年开发者调查,这两种技术非常流行,并且具有巨大的开发者适应性。超过 40% 的参与调查的开发人员表示他们使用 React,而近 23% 的开发人员对 Angular 持相同看法。这意味着 React 拥有比 Angular 更多的人使用他们的技术。


这是一个优点,也是一个缺点。它是专业的,因为这意味着 React 拥有一个更大更强大的社区,可以帮助新开发人员更快地学习并找到更好的资源。缺点是由于市场饱和,React 开发人员可能缺乏工作场所。Angular 如此,拥有一个较弱但虽然很棒的社区,但也缺少较低的工作场所。


另一个证明 Angular 用户对 React 的热爱的数字是 GitHub 库中的开始。元技术有 11.8 万颗星,而谷歌“只有”7.9 万颗星。



04


重要区别:库与框架


这两种技术之间的主要区别之一是 React 是一个库,而 Angular 是一个框架。这是什么意思?本质上,当您使用库时,您负责整个应用程序的流程,而框架可以为您处理。在库中,您可以随时调用元素,使用框架时您会受到更多限制,但也更安全。



05


它们是如何工作的


React 使用单个页面,您可以在其中放置、添加和删除不同的部分,称为组件。在 React 哲学中,这个组件必须是可重用且轻量级的。这种范式使页面结构更容易处理和修改,也提高了整个项目的性能。React 不会在每次发生某些事情时重新渲染整个页面。为了处理这个问题,他使用了虚拟 DOM,它允许站点仅重新加载站点所需的组件或块。它还允许服务器端渲染 (SSR) 扩展客户端的性能。


首先,Angular 似乎更复杂、更强大,但却是一个了不起的框架。它提供了简单的双向数据绑定、MVC 模型、路由包、依赖注入。这些都是很棒的功能,对于没有太多经验的初学者来说,这听起来也很吓人。这些概念是 Angular 工作方式的核心。


双向数据绑定只是一种让组件共享数据并确认某些事件的机制。MVC 模型是组件组织和放置在页面上的方式,您可以简化对象及其行为的思考。路由包是一组指令,让页面在路由器内部创建一些路由,这样当请求进来时,可以识别并生成不同的页面。然后,最后,依赖注入是一种机制object 接收它所依赖的其他对象。最后一个听起来仍然很棘手。但是,这就是 Angular 的整体情况:一个具有大量强大功能的庞大框架,其中一些还非常先进。



06


性能

这两种技术的性能可以很容易地进行比较。它们都是用 JavaScript 编写的,所以我们不需要做奇怪的基准测试或非常复杂的算法来决定哪个性能更好。我们只需要在两者的规格中进行一些简单的理论观察。更准确地说,您可以猜到,性能最高的应该是较轻的,占用空间较小的。


那么,哪一个更轻呢?它是 React,它的 43kb 空间与 Angular 的 143kb 相对。但是,为什么这种差异如此之大?React 是一个库,而 Angular 是一个框架,所以他也有自己的语言来呈现页面,而 React 使用 JSX。此外,Angular 有很多额外的功能,这会使所有数据包变得更大,并降低性能。这就是 React 具有更好性能的原因。此外,可以从可通过 npm 安装的不同库中获取 React 缺少的功能。


07


哪一个更好呢?

React 没有像 Angular 那样实现 MVC,所以需要导入其他库来使用它,这不是最优的。如前所述,由于大量的依赖关系,Angular 往往非常缓慢,并且难以扩展。此外,如此庞大的功能数量使学习曲线更加陡峭。


显然,就像在科技界的几乎所有辩论中一样,没有绝对的赢家,但有些案例表明采用一种技术而不是另一种更好。因此,有时建议使用 Angular,有时建议使用 React。


但是,这些情况是什么?如果你想使用更少的外部依赖,Angular 是不二之选。如果你想要一个更健壮的框架,Angular 100%是最好的。另一方面,如果您想要更多性能,并使您的应用程序更具可扩展性,那么 React 是更好的选择。如果你不需要大量的特性,而只需要一些必要的部分来实现中小型项目,那么 React 看起来会更好。此外,如果您需要在开发阶段更快速、更灵活,建议使用 React。如果对你来说社区方面很重要,那么 React 是肯定的。


如果你是初学者,两者都是不错的选择,但我建议你学习 React。注意:在正确学习 JavaScript 之前不要学习其中任何一个。否则,一切都会变得异常艰难,你会因为缺乏基础而放弃。