马克西米利安Schwarzmuller

当学生问在前端网站开发项目中使用哪种JavaScript框架-betwayapp下载安装Angular vs React.js vs Vue.js,我不得不承认没有完美的答案。相反,我会引导他们了解每种选择的优缺点。我通过每个框架的主要特性、行业流行度、总体性能和开发人员的用户体验来进行比较。

在深入比较每个web开发框架之前,这里是每个选项的快速概述:betwayapp下载安装

角8是Angular的最新版本,一个由谷歌维护的JavaScript框架,它是基于客户端和浏览器的。Angular允许网站快速高效地渲染,而不是通过与服务器对话来重载HTML页面。它是一个一体化的框架,具有用于路由、状态管理解决方案和表单验证的内置工具。Angular是建立在TypeScript之上的,TypeScript是JavaScript的超集。

React.js

由Facebook开发和维护,React.js是一个流行的JavaScript库,主要用于为web页面构建和呈现组件。使用React.js,所有东西都内置在JavaScript中,我建议使用它JSX, JavaScript语法扩展,它在JavaScript代码中“描述了UI应该是什么样子”。

与Angular不同,React.js并不是一套完整的工具,它是由一些工具组成的,这些工具可以帮助你构建要放到页面中的组件。这使得React.js更加精简,但它确实要求开发人员使用额外的库来包含React.js所缺乏的功能。例如,React.js中不包含路由,因此必须通过第三方工具手动添加。

Vue.js

Vue.js是一个开源JavaScript框架,结合了React.js和Angular的特性。与React.js和Facebook不同,Vue.js的开发背后并没有一家大型科技公司。betwayapp下载安装它是由前谷歌员工,艾凡,你他已经组建了一个核心团队,负责维护Vue.js的路由和状态管理。

和Angular一样,Vue.js是一个完整的框架,尽管它的特性和包更少。多亏了丰富的文档关于Vue.js及其简单的语法,所有经验级别的程序员,即使是那些只有初级JavaScript和HTML知识的程序员,都应该发现这个框架是一个简单的选择。

现在,让我们比较一下这些JavaScript框架,根据以下六个标准,哪些框架对你的项目最有意义:

1.学习曲线

根据他们的背景,开发人员对于哪个框架最容易学习会有不同的看法。

学习曲线赢家?Vue.js

2.单页面应用程序

单页应用程序(spa)是高度反应性的,类似移动的web应用程序,没有页面重新加载等待时间。该页面基于单个HTML文件,而JavaScript控制用户在浏览器中看到的所有内容。当单击按钮或页面上出现新窗口时,不会向服务器发出请求。相反,JavaScript代码被立即修改和呈现。

温泉很受欢迎,因为它们加载速度很快。下面是一个例子我的一门Udemy课程,您可以点击视频播放器下面显示的选项卡,如Q&A选项卡,而不会看到页面刷新。由于JavaScript和框架在浏览器中运行,不需要与服务器通信来显示Q&A标签的内容,您将立即在视频播放器下面看到它。

那么,这三个框架在构建水疗中心方面是如何结合在一起的呢?谷歌为创建spa而显式地构建了Angular。TypeScript和Angular所有内置工具和服务的使用,让开发者在Angular上创建SPA成为一种很棒的体验。路由、状态管理解决方案和表单验证等工具支持“开箱即用”的开发体验。betwayapp下载安装在较大的spa中使用React.js或Vue.js可能会比在使用Angular时带来更大的复杂性,比如支持表单所需的包的可用性。

单页面应用赢家?

3.多页面应用程序

多页面应用程序(MPA)是一个“传统”网站,比如您最喜欢的电子商务或媒体网站。每当站点想要显示新数据或向服务器发送数据时,都会向服务器发送请求,并在浏览器中呈现。

当使用React.js增强页面现有的HTML时,它可以很好地用于这些项目。您可以导入React.js来将强大的基于javascript的组件添加到页面中,不过值得注意的是,为了使用JSX构建React.js组件,您仍然需要某种前端构建工作流。不过,Vue.js在MPAs中使用非常简单。导入Vue.js库,开始将其特性和组件整合到页面中,不需要特殊的设置。总的来说,Vue.js和React.js在向MPAs添加JavaScript功能方面都做得很好。

我认为Vue.js比React.js好一点,因为你不需要使用一些特殊的语法(JSX),需要一个构建步骤(注意:JSX是可选的,但实际上是构建React.js组件的标准)。

我不推荐在构建MPA时使用Angular。Angular的组件一体化方法和TypeScript的使用,并没有让它成为一个理想的框架。将Angular包导入HTML会变得不必要的复杂。尝试在一个html驱动的应用程序(比如MPA)中编译TypeScript,不仅会影响性能,还会给你和你的开发团队带来麻烦。betwayapp下载安装总的来说,Angular是用来帮助你构建spa的;虽然它在未来可能成为MPAs的一个更可行的选择,但我们还没有到那一步。

多页面应用程序的赢家?Tie-React.js, Vue.js

帮助你的团队学习新的JavaScript框架。请求一个演示找到适合你的项目的webbetwayapp下载安装开发课程。]

4.性能基准测试

加载时间慢或性能滞后的网站是一个主要的业务风险。让客户等待几分钟,等待页面完全呈现,那么他们很有可能已经转移到竞争对手的网站上了。

为了检查每个框架的执行情况,我引用在Github上的JavaScript框架基准项目。不过,这些基准测试结果都是相对的,因为每个框架都非常快。需要注意的是,基准测试可能有点棘手,因为在一个场景中,一个框架的性能可能比其他框架更好,但在基准测试研究中没有考虑到的场景中,会看到不同的性能。

根据基准测试项目的结果,如下面的截图所示,Angular在启动时比React.js和Vue.js慢。虽然Angular通常是一个快速的框架,但它也有一个很大的bundle。这有助于Angular在使用大型应用时比React.js或Vue.js拥有更快的性能。React.js和Vue.js更适合小型应用。

性能基准的赢家?None-React.js、Vue.js和Angular都有很好的运行时性能。

5.部署

使用这些框架时,您或您的团队部署应用程序的难度有多大?

尽管总体上最具挑战性的框架是Angular,但如果你在使用Angular CLI,这个过程实际上很简单,因为大部分工作已经为你完成了。CLI处理从项目创建到代码优化的所有事情。在运行单个命令时,你会得到一个完全优化的、捆绑的应用程序,可以部署到任何静态主机上。把这个应用变成一个通用的(服务器端预渲染的应用)也只需要一个命令。

构建和部署React.js应用也很容易。与create-react-app你有一个工具,可以生成新的、完全预配置的React.js应用程序,其中包含了开发和最终构建项目所需的一切。betwayapp下载安装通过提供的配置,您还可以得到一个完全优化的项目,可以将其部署到任何静态主机上。但与Angular CLI不同的是,你不能用一条命令就添加服务器端渲染。

对于Vue.js,您还拥有一个CLI,它可以生成强大的项目设置,并预先配置所有内容。betwayapp下载安装开发很容易,就像使用Angular和React.js一样,你可以在运行一个内置命令时得到优化的项目。js项目可以部署到任何静态主机上,并且打开服务器端渲染(为了SEO的价值)也相当容易。

部署的赢家?Angular有一个小小的优势,但总的来说,这三个选项都很容易管理和部署。

6.行业应用

堆栈溢出2019开发者调查其中,React.js和Vue.js分别被评为最受欢迎的web框架的第一和第二名。js被认为是开发人员使用第二广泛的web框架,突出了它在业界的需求。

截至2019年8月撰写本文时,Indeed.com列出了将近15000个需要React.js技能的工作在美国。目前有13500个与angular相关的工作岗位,2200个与vue .js相关的工作岗位。在这三种框架中,React.js可能是工程团队领导和希望扩展web开发技能的开发人员优先考虑的最佳技能。betwayapp下载安装

行业采用的赢家?React.js和角

就像每一种编程语言一样,框架和库也有它们自己的优缺点。当决定在项目中使用哪种JavaScript框架时,我鼓励开发人员和工程管理人员在这里列出的比较中关注团队资源。你的团队有能力学习更复杂的框架吗?他们能够使用这个框架支持持续的优化吗?一旦你决定了哪个框架是最适合你的组织环境的,通过确保你的团队能够成功投资你未来的应用这些发展技能的全面培训betwayapp下载安装

页面最后更新:2019年8月

JavaScript顶级课程

50天50个项目- HTML, CSS和JavaScript
布拉德·布莱特,弗洛林·波普
4.7 (3159)
畅销书
完整的JavaScript课程2021:从零到专家!
乔纳斯Schmedtmann
4.7 (101866)
畅销书
JavaScript -完整指南2021(初学者+高级)
学术作者:Maximilian Schwarzmüller, Maximilian Schwarzmüller
4.7 (13785)
理解怪异的部分
安东尼Alicea
4.7 (41132)
现代JavaScript(完整指南,从新手到忍者)
网络忍者(肖恩·佩林)
4.8 (6320)
评价最高
从头开始学习JavaScript:全栈
布拉德·希夫
4.8 (3,440)
Javascript教程和项目课程
约翰Smilga
4.7 (1647)
JavaScript:高级概念(2021年)
安德烈Neagoie
4.8 (7807)
完整的JavaScript和ES6教程-(包括ES7和React)
大卫·约瑟夫·卡茨
4.5 (2965)
JavaScript圣经- JavaScript训练营2021
Bogdan Stashchuk
4.8 (1180)

更多JavaScript的课程

JavaScript学生也要学习

让你的团队。领导行业。

通过Udemy for Business为您的组织订阅在线课程图书馆和数字学习工具。

请求一个演示

Maximilian的课程Schwarzmüller

角(2+)verstehen和anwenden
马克西米利安Schwarzmuller
4.5 (1512)
畅销书
React JS, Angular和Vue JS -快速入门和比较
Maximilian Schwarzmüller, Academind by Maximilian Schwarzmüller
4.7 (2429)
Microsoft Power BI - A Complete Introduction [2021 EDITION]
曼努埃尔·洛伦兹,作者:马克西米兰Schwarzmüller,马克西米兰Schwarzmüller
4.6 (45285)
Angular -完整指南(2021版)
马克西米利安Schwarzmuller
4.6 (142493)
畅销书
Angular & NodeJS - The MEAN Stack Guide[2021版]
马克西米利安Schwarzmuller
4.6 (19466)
畅销书
加速JavaScript培训
马克西米利安Schwarzmuller
4.6 (4501)
加速ES6 JavaScript培训
马克西米利安Schwarzmuller
4.7 (4697)
了解TypeScript - 2021版
马克西米利安Schwarzmuller
4.7 (20726)
畅销书
Vue -完整指南(w/ Router, Vuex, Composition API)
马克西米利安Schwarzmuller
4.7 (46232)
畅销书
Ionic -使用Ionic和Angular构建iOS、Android和Web应用
马克西米利安Schwarzmuller
4.7 (13806)
畅销书
Angular的样式和动画(适用于Angular 2+)
马克西米利安Schwarzmuller
4.8 (1411)
评价最高
AWS无服务器api和应用程序-一个完整的介绍
学术作者:Maximilian Schwarzmüller, Maximilian Schwarzmüller
4.7 (9914)
畅销书

Maximilian的课程Schwarzmüller