美文网首页代码优雅前端那些事前端参考
Angular vs React vs Vue 三个框架的比较

Angular vs React vs Vue 三个框架的比较

作者: Howie126313 | 来源:发表于2018-02-21 06:44 被阅读685次

    Foreword:

    首先那要说明下,以下是我看到的一篇文章,但是原文是英文的,我只是做一个搬运工把他搬过来~主要也是为了能在搬运过程中更好的理解作者的想法。OK,废话到此为止。


    Started:

    为你的 web 应用选择一个框架是无法抗拒的。Angular 和 React 最近都很受欢迎,最近又出现了一个新贵吸引了很多关注: VueJS 。而且,这些只是在这个领域新鲜血液的一部分。所以,我们应该怎样选择?一个关于利弊的清单总是没有坏处的。

    在我们开始之前 — SPA or not?

    首先,你应该明确你的应用是否需要单页面应用还是多页面的方法。你可以通过去阅读这篇文章作者的博客,有一篇关于多页面和单页面应用的对比,做出适合你的选择。

    如今的新人 Angular, React , Vue

    首先,我想讨论一下生命周期和长远的考虑。然后,我们将重点转向这三个 JavaScript 框架的功能和概念。最后,得出我们的结论。

    以下是我们今天要解决的问题:

    • 框架和库有多成熟?
    • 框架可能会在很短的时间内出现吗?
    • 他们相应的社区有广泛的帮助吗?
    • 为每个框架找到相应的开发者的困难程度?
    • 框架的基本编程概念是什么?
    • 对一个大项目或者小项目来说,使用框架的难易程度?
    • 每个框架的学习曲线是什么样的?
    • 你希望框架能够给你提供怎样的性能?
    • 在底层的能否有更仔细的了解?
    • 用选择的框架如何开始开发?

    准备就绪,开始!

    1. 生命周期和长远的考虑

    1.1 历史

    Angular 是一个基于 TypeScript 的 Javascript 框架。 由 Google 开发和维护,它被描述为“超级英雄般的JavaScript MVW 框架”。 Angular(也称为“Angular 2+”,“Angular 2”或“ng2”)是 AngularJS(也称为“Angular.js”或“AngularJS 1.x”)的改写,大多为升级了兼容性的继承者。尽管最初般被的 AngularJS 于2010年10月发布,但它仍然在修复bug等问题。新的Angular(sans JS)于2016年9月推出,版本为2.最新的主要版本为版本4, 版本3被跳过。Google,Wix,weather.com,healthcare.gov 和 Forbes 在使用Angular。

    React 被描述为“用于构建用户界面的 JavaScript 库”。 React 最初于2013年3月发布,由 Facebook 开发并维护,在多个页面上使用 React 组件(不是作为单页应用程序)。根据 Chris Cordle 撰写的这篇文章,React 在 Facebook 上的使用远远多于 Angula r在Google上的使用。 React 也被Airbnb,Uber,Netflix,Twitter,Pinterest,Reddit,Udemy,Wix,Paypal,Imgur,Feedly,Stripe,Tumblr,Walmart 等等。

    Facebook 正在开发React Fiber。它会改变引擎盖下的 React 渲染速度应该更快。更新之后,会向后兼容。 Facebook 在2017年4月的开发者大会上讨论了这些变化,并发布了一篇关于新架构的非官方文章。 React Fiber 于2017年9月发布了 React 16。

    Vue 是2016年发展最迅速的 JS 框架之一. Vue 将自己描述为“用于构建交互式界面的直观,快速和可组合的 MVVM 框架”。该框架于2014年2月首次由前 Google 员工尤雨溪发布,当时写了一篇关于营销活动和数字的有趣的博客文章。 这是一次非常成功的比赛,尤其是考虑到 Vue 在没有大公司支持的情况下获得如同一个人的表演一样的吸引力。 Vue 目前拥有一批核心开发人员。 2016年,版本2发布。 Vue 被阿里巴巴、百度、Expedia、任天堂和 GitLab 使用,小型项目列表可以在 madewithvuejs.com 上找到。

    以上的三中框架都采用 MIT 许可。直到2017年9月,React 转向特殊的 BSD3 许可。有关专利文件的讨论很多。如果您对这段历史感兴趣,您可以阅读 Github 相关的问题讨论,专利文件背后的原因和历史(由 Facebook 前工程师 James Ide 撰写),为什么您不应该害怕(由 Dennis Walsh 提供), 警告不要使用创业公司(由 RaúlKripalani 提供)以及 Facebook 上关于此主题的陈述:解释 React 的许可。无论如何,所有这些都不应该像 Facebook 最终宣布的那样,React 将使用 MIT 许可。

    1.2 核心发展

    综上所述,Angular 和 React 拥有大公司的支持和使用。Facebook,Instagram 和 Whatsapp 将 React 用于他们的页面。 谷歌在很多项目中使用它,例如,新的 Adwords 用户界面是使用 Angular&Dart 实现的。 再次,Vue 是由一群通过 Patreon 和其他赞助方式支持其工作的个人实现的。 您可以自行决定这是正面还是负面。 MatthiasGötzke 认为 Vue 的小团队是一个好处,因为它会导致更简洁,更少的过度设计的代码或者 API。让我们来看看一些统计数据:Angular 在他们的团队页面上列出了36个人,Vue 列出了16个人,而 React 没有团队页面。 在 Github 上,Angular 拥有超过25,000星和463名贡献者,React 拥有超过7万星和超过1,000个贡献者,而 Vue 拥有近6万的星和120名贡献者。 您还可以查看 Github Stars 的 Angular,React 和 Vue 历史。 再次,Vue 似乎趋势非常好。 根据 bestof.js 的数据,在过去三个月中,Angular2 的平均每天获得31颗星,React 74颗星和 Vue.JS 107颗星。


    1.3 市场生命周期

    由于各种名称和版本,很难在 Google 的趋势中比较 Angular,React 和 Vue。 一种近似的方法可能是搜索“ Internet&technologies ”类别。 结果如下:

    好吧。 Vue 在2014年前还没有被创建,所以这里有些不对劲。 La Vue是法国人的“观看”,“视线”或“意见”。 也许就是这样。 VueJS 和 Angular 或 React 的比较也不公平,因为 VueJS 几乎没有任何结果。

    那么,我们试试其他的东西吧。 ThoughtWorks 的技术雷达给人留下了良好的印象,关于技术如何随着时间演变的。 Redux 正处于采用阶段,并且它在许多 ThoughtWorks 项目中具有无可估量的价值。 Vue.js 正处于试用阶段。 它被描述为 Angular 的轻量级和灵活的替代品,学习曲线较低。 Angular2 处于评估阶段,它已被 ThoughtWork 团队成功使用,但尚未获得强有力的推荐。根据上一次 Stackoverflow 2017调查,React 被67%的被调查开发者喜爱而 AngularJS 则是52%。 没有兴趣继续开发使用 AngularJS 的为48%,React 为33%。 在这两项调查中,Vue 都没有进入前十名。 接下来是 statejs.com 调查,比较了“前端框架”。 最有趣的事实:React 和 Angular 有100%的认知度,23%被调查的人不知道 Vue。 关于满意度,会再次使用的 React 有92%,Vue 89% 而 Angular 2仅获得65%。另一个客户满意度调查呢? Eric Elliott 于2016年10月开始评估Angular 2和 React。 只有38%的受访者会再次使用 Angular 2,而84%的人会再次使用 React。

    1.4长期支持和迁移

    正如 Facebook 在其设计原则中所述,React API 非常稳定。 还有一些脚本可以帮助您从当前的 API 转移到更新的 API :react-codemod。迁移非常简单,并且不需要作为长期支持版本。 在这篇 Reddit 文章中,人们注意到升级并不是个问题。 React 团队撰写了一篇关于他们的版本控制计划的博客文章。当他们发布弃用警告时,他们会在下一个主要版本中的行为更改之前保留当前版本的其余部分。以下没有计划更改为新的主要版本 - v14于2015年10月发布,v15于2016年4月发布,而v16尚未发布日期。 正如React核心开发人员最近指出的,升级不应该是一个问题。

    关于 Angular,有一篇关于版本控制和发布 Angular 的博客,从 v2 发布开始。 每六个月会有一次重大更新,并且至少有六个月(两次主要发布)的弃用期。在文档中标记了一些实验性的 API,其拥有较短的弃用期。目前还没有官方声明,但根据这篇文章,Angular 团队已经宣布了从 Angular 4开始的长期支持版本。这些版本将在下一个主要版本发布之后至少支持一年。这意味着至少在2018年9月之前支持 Angular 4,并提供 bug 修复和重要补丁。 在大多数情况下,将 Angular 从v2更新到v4与更新 Angular 依赖关系一样简单。 Angular 还提供了有关是否需要进一步更改的信息指南。

    Vue 1.x到2.0的更新过程对于一个小应用程序来说应该很容易,开发人员团队声称90%的API 保持不变。 在控制台上有一个很好的升级,诊断迁移、辅助工具。 一位开发人员指出,从v1到v2的更新在大型应用程序中没有什么改变。 不幸的是,关于下一个主要版本或关于长期支持版本计划的信息没有清晰的(公共)路线图。

    还有一件事:Angular 是一个完整的框架,并提供了很多捆绑在一起的东西。 React 比Angular 更灵活,你可能会使用更独立,不稳定,更快速方便的库,这意味着您需要自行处理相应的更新和迁移。如果某些包裹不再被保留,或者某些其他包裹在某些时候成为事实上的基准,这也可能是不利的。(没搞懂作者这句换的意思...)

    1.5人力资源和招聘

    如果你的 HTML 开发人员不想学习更多的 Javascript,最好选择 Angular 或 Vue。 React 需要学习更多的 Javascript(稍后会讨论这个)。你有没有设计人员接近代码? 用户“pier25”在 Reddit 上指出,React 让你有一种感觉,如果你在 Facebook 工作,每个人都是超级英雄般的开发人员。在现实中,你不一定能找到一个可以修改 JSX 的设计师。因此,使用 HTML 模板将更容易。

    关于 Angular 的好处是,从另一家公司新来的的 Angular 2开发人员将很快熟悉所有必要的约定。由于在架构决策 React 则各不相同,开发人员需要熟悉特定的项目设置。

    如果你的开发人员具有面向对象的背景或者不喜欢 Javascript,那么 Angular 也很好。 为了支持这个歌观点,以下是马赫什昌德的话:

    I am not a JavaScript developer. My background is building large-scale enterprise systems using “real” software platforms. I started in 1997 building applications using C, C++, Pascal, Ada, and Fortran. (…) I can clearly say that JavaScript is just gibberish to me. Being a Microsoft MVP and expert, I have a good understanding of TypeScript. I also don’t see Facebook as a software development company. However, Google and Microsoft are already the largest software innovators. I feel more comfortable working with a product that has strong backing from Google and Microsoft. Also (…) with my background, I know Microsoft has even bigger plans for TypeScript.

    好吧......我应该提到,Mahesh 是微软的区域总监。

    2. React, Angular & Vue 的比较

    2.1组件

    以上讨论的框架都是基于组件的。组件获取输入,并在内部执行一些行为或计算之后,它返回一个呈现的 UI 模板(登录/注销区或待办事项列表项)作为输出。 定义的组件有利于在网页或其他组件中重复使用。 例如,您可以拥有包含各种属性(列,标题信息,数据行等)的网格组件(包含标题组件和多个行组件),并且可以在另一个页面上使用具有不同数据集的组件。
    React 和 Vue在处理组件方面都很出色:小的、无状态的函数接收输入,然后返回元素作为输出。

    2.2 Typescript vs. ES6 vs. ES5

    React 专注于使用Javascript ES6。 Vue 则使用Javascript ES5和ES6。

    Angular 依赖于 TypeScript。这为相关示例和开源项目提供了更多一致性(React示例可以在ES5或ES6中找到)。TypeScript 也引入了像装饰器和静态类型的概念。 静态类型对于代码智能工具很有用,例如自动重构,跳转到定义等。Eric Elliott 在他的文章“关于静态类型的令人震惊的秘密”中不同意。 Daniel C Wang 表示,使用静态类型没有任何坏的影响,而且拥有测试驱动开发(TDD)和静态类型是很好的。尽管没有共识,他们也应该减少应用程序中的错误数量。

    你也应该知道可以使用 Flow 在 React 中启用类型检查。 这是 Facebook 为 JavaScript 开发的静态类型检查器。Flow 也可以集成到 Vue 中。

    如果你在使用 TypeScript 编写代码,你编写的不再是标准 JavaScript。尽管TypeScript 在不断增长,但与整个 JavaScript 相比,TypeScript 的用户群仍然很小。存在一种风险,就是你的方向错误。由于 TypeScript(虽然不太可能) 可能会伴随着时间而消失。此外,TypeScript 使得项目增加了很多学习方面的开销。你可以在 Eric Elliott 的“Angular 2 vs. React”的比较中阅读更多关于这方面的内容。

    更新:James Ravenscroft 在对本文的评论中写道,TypeScript 对 JSX 有一流的支持。可以无缝地对组件进行类型检查。所以如果你喜欢 TypeScript 并且你想使用 React,这应该不是个问题。

    2.3 模板 — JSX 还是 HTML

    React 打破了长期以来的尝试。几十年来,开发人员始终尝试将 UI 模板和内联 Javascript 逻辑分开,但 JSX 将这些又混合在一起。这可能听起来很糟糕,但是你应该听Peter Hunt 的演讲“ React:反思最佳实践”(2013年10月)。他指出,分离模板和逻辑仅仅是技术的分离,而不是担心。你应该构建组件而不是模板。组件是可重用的、可组合的、可单元测试的。

    JSX 是一种类似 HTML 语法,稍后将在 JavaScript 中进行编译可选预处理程序。 它有一些怪癖。例如,您需要使用 className 而不是 class,因为后者是 Javascript 中的受保护名称。JSX 对于开发来说是一个很大的优势,因为你在一个地方拥有了所有的东西,并且代码完成和编译时检查更好地工作。当你在 JSX 中输入拼写错误时,React 将无法编译,并打印出发生错字的行号。如果是在 Angular 2上运行,也会失败。但并不会报错(如果您使用AOT和Angular,则这个参数可能无效)。

    JSX 意味着 React 中的所有内容都是 Javascript,它用于 JSX 模板和逻辑。Cory House 在2016年1月的文章中指出:“Angular 2继续将'JS'放入HTML中。React将'HTML'放入JS中。“ 这是一件好事,因为 Javascript 比 HTML 更强大。

    Angular 模板使用特殊的 Angular 语言(比如 ngIf 或 ngFor)来增强 HTML。 虽然React 需要 JavaScript 的知识,但 Angular 会迫使您学习 Angular 特有的语法。

    Vue 具有“单文件组件”。这似乎是关于分离问题的一种权衡。模板,脚本和样式在一个文件中,但在三个不同的有序部分中。这意味着您可以获得语法高亮,CSS 支持以及更容易使用预处理器(如 Jade 或 SCSS)。我在其他文章中已经读过,JSX更易于调试,因为 Vue 不会显示错误的 HTML 语法错误。这不是真的,因为 Vue 将 HTML 转换为渲染函数 ,所以错误显示没有问题(感谢 Vinicius Reis 的评论和更正!)。

    注意:如果你喜欢 JSX 的想法并想在 Vue 中使用它,你可以使用 babel-plugin-transform-vue-jsx。

    2.4框架 VS 库

    Angular 是一个框架而不是一个库,因为它提供了关于如何构建应用程序的强大意见,以及开箱即用的更多功能。Angular 是一个“完整的解决方案”,随时为你提供愉快的开始。不需要分析库,路由解决方案等,只需开始工作即可。

    另一方面,React 和 Vue 更加灵活。他们的库可以配对各种套餐(在 npm 上有很多React,但 Vue 的套餐较少,因为它还很年轻)。有了React,你甚至可以将库本身交换为 API 兼容的替代品,如 Inferno。但是伴随的很好的灵活性,随之而来的是更多的责任。对 React 没有规则和有限的指导。每个项目都需要有关其架构的决策,可能更容易出现错误。

    另一方面,Angular 还有一堆令人困惑的构建工具,样板,短裤和时间接收器需要处理。如果使用起动器套件或样板,React 也是如此。他们自然是非常有帮助的,但 React 可以直接使用,这可能是你应该学习的方式。有时,在 Javascript 环境中工作所需的各种工具被称为“ Javascript 疲劳”。 Eric Clemmons 有一篇关于它的文章,他这样说:

    “There are still a bunch of installed tools, you are not used to, when starting with the framework. These are generated but probably a lot of developers do not understand, what is happening under the hood — or it takes a lot of time for them to do.”

    Vue似乎是三个框架中最干净和最轻的框架。 GitLab有关于其决定使用 Vue 的博客文章:

    “Vue.js comes with the perfect balance of what it will do for you and what you need to do yourself.(…) Vue.js is always within reach, a sturdy, but flexible safety net ready to help you keep your programming efficient and your DOM-inflicted suffering to a minimum.”

    他们喜欢简单易用,源代码非常易读,不需要任何文档或外部库。一切都非常简单。 Vue.js“对任何东西都不做过多的假设和约束”。还有另一篇博客关于向Vue转变来自 Pixeljets。 React 在状态的意识上,向JS世界迈进了一大步,它很好的为很多人展示了真正的功能性编程。由于 JSX 的限制 React 和 Vue 比较的一个缺点是将组建分割成更小的组件的问题。这里是文章的引用:

    “For me and my team the readability of code is important, but it is still very important that writing code is fun. It is not funny to create 6 components when you are implementing really simple calculator widget. In a lot of cases, it is also bad in terms of maintenance, modifications, or applying visual overhaul to some widget, because you need to jump around multiple files/functions and check each small chunk of HTML separately. Again, I am not suggesting to write monoliths — I suggest to use components instead of microcomponents for day-to-day development.”

    Vue 的异议者和支持者,在 Hacker news 和 Reddit 上有很有趣的讨论。

    2.5状态管理和数据绑定

    构建用户界面很困难,因为处处都有状态,随着时间的推移数据变化会带来复杂性。定义状态工作流程对于应用程序的增长和变得更加复杂时有很大的帮助。对于有限的应用程序,这可能是没有有必要的,像 Vanilla JS 就足够了。

    它是如何工作的? 组件在任何时间点绘制 UI。当数据发生变化时,框架会重新渲染整个 UI 组件,所以显示的数据始终是最新的。我们可以将这个概念称为“ UI 作为函数”。

    React 经常与 Redux 捆绑使用。 Redux 三个基本原则:

    • 单一的来源
    • 状态是只读的
    • 通过函数更改

    换句话说:完整应用程序的状态存储在单个存储中的对象树中。这有助于调试应用程序,并且一些功能更容易实现。状态是只读的,只能通过动作来改变,以避免竞争条件(它也有助于调试)。编写 Reducers 来指定状态如何通过动作转换。

    大多数教程和样板文件已经集成了 Redux,但是如果没有它,你也可以使用 React(并且根本不需要 Redux)。Redux 在代码中引入了复杂性和相当强的约束条件。如果你正在学习 React,那么在你使用 Redux 之前,你应该考虑学习普通的 React。 你肯定应该阅读 Dan Abramov 的“你可能不需要 Redux”。

    一些开发人员建议使用 Mobx 而不是 Redux。 你可以把它看作是一个“自动 Redux”,这使得一开始就更容易使用和理解。如果你想看看,你应该从介绍开始。你还可以阅读 Robin 的 Redux 和 Mobx 之间的比较。同一作者还提供有关从 Redux 移动到 Mobx 的信息。如果你想检查其他 Flux 库,此列表非常有用。如果你是来自 MVC 世界,你将需要阅读 Mikhail Levkovsky 撰写的文章“ Redux 中的思考(当你认识的所有人都是 MVC)”。

    Vue 可以使用 Redux,但它提供 Vuex 作为自己的解决方案。

    React 和 Angular 之间的巨大差异是单向与双向绑定。当 UI 元素(例如,用户输入)被更新时,Angular 的双向绑定改变模型状态。React 只有一种方式:先更新模型,然后呈现 UI 元素。Angular 的方法在代码中更干净,开发人员更容易实现。React 的方式可以获得更好的数据概览,因为数据只向一个方向流动(这使得调试更容易)。

    这两个概念都有其优点和缺点。你需要了解这些概念并确定它是否会影响您的框架决策。文章“双向数据绑定:Angular 2和 React”提供了一个很好的解释。在这里你可以找到一些交互式代码示例(3岁(啥意思...),仅适用于Angular 1和React....)。 最后但并非最不重要的一点,Vue 支持单向绑定和双向绑定(默认为单向)。

    2.6其他编程概念

    Angular包含依赖注入,即一个对象将依赖项(服务端)提供给另一个对象(客户端)的模式。 这导致更多的灵活性和更干净的代码。模型 - 视图 - 控制器模式(MVC)将项目分为三个部分:模型,视图和控制器。作为 MVC 框架的角度 MVC 开箱即用,反应只有 V。所以你需要自己解决 M 和 C.

    2.7灵活性和缩小到 microservices

    你只需将JavaScript库添加到源代码中,就可以可以使用 Vue 和 React。由于使用了 TypeScript,Angular 就没有这么方便了。

    我们现在更多地转向 microservices 和 microapps。 React 和 Vue 通过只选择真正必需的东西,可以更多地控制应用程序的大小。他们提供了更多的灵活性,使用前应用程序的一部分从 SPA 转移到 microservices。Angular 最好工作在 SPA ,因为它可能太臃肿而无法用于 microservices。

    有些人对非 SPA 网站也使用 React(例如,对于复杂的表单或向导)。即使 Facebook 使用 React 也不是为主页面,而是为特定的页面和功能。

    2.8大小和性能

    所有功能都有另一面:Angular 非常臃肿。gzip 文件大小为143k,而 Vue 为23K,React 为43k。React 和 Vue 都有一个虚拟 DOM,它可以提高性能。如果您对此感兴趣,可以阅读有关虚拟 DOM 和 DOM 之间的差异以及 react.js 中虚拟 DOM 的实际优势。

    为了检查性能,我看了一下这个 js 框架基准。你可以自己下载并运行它,或者查看交互式结果表。在检查结果之前,您应该知道,框架在基准测试中作弊。因此这种性能检查不应该用于做出决定。

    总结一下:Vue 具有很好的性能和最深的内存分配,但与特别慢或者快速的框架(如 Inferno )相比,所有这些框架都非常接近。再说一次:性能基准只能作为附注来考虑,而不能作为判断。

    2.9测试

    Facebook 使用 Jest 来测试其 React 代码。在Angular 2中有 Jasmine 作为测试框架。Eric Elliott 的一篇文章中咆哮说 Jasmine “以数百种方式编写测试和断言,需要仔细阅读每一个以了解它在做什么”。 输出也很臃肿,阅读起来很费力。Vue 缺乏测试指导,但尤雨溪在他的2017年预览中写道,该团队计划在这方面开展工作。他们推荐使用 Karma。 Vue 与 Jest一起工作,并且还有 avoriaz 作为测试工具。

    2.10通用和原生应用

    通用应用程序正在将应用程序引入网络,到桌面以及 native 应用程序的世界。React 和 Angular 都 native 本地开发。Angular 拥有 native 应用程序的 NativeScript (由 Telerik 支持)和混合应用程序的 Ionic Framework。 使用 React,你可以查看 react-native-renderer 来构建跨平台的 iOS 和 Android 应用程序。许多应用程序(包括 Facebook )都是用 react-native 构建的。

    Javascript 框架在客户端上呈现页面。这对整体的用户体验和搜索引擎优化是不利的。服务器端的渲染是很好的一个解决办法。所有这三个框架都有相关的库来寻求帮助。 React 有 next.js,Vue 有 nuxt.js,Angular 有... .Angular Universal。

    2.11学习曲线

    Angular 有一个陡峭的学习曲线。它有全面的文档,但有时你可能会对它感到沮丧,因为事情比听起来更困难。即使你对 Javascript 有深入的理解,你也需要了解该框架背后的内容。 安装程序在开始时很神奇,它提供了很多包含的软件包和代码。这可能被视为一种负面情绪,因为随着时间的推移,你需要学习一个大型的,预先存在的生态系统。另一方面,在特定情况下它可能会很好,因为它已经替你做出了很多决定。对于 React,你可能需要就第三方库进行大量重大决策。有16种不同的 flux 组合用来管理状态。

    Vue 很容易学习。公司切换到 Vue 是因为它对初级开发人员来说更容易。一位用户表示,他公司的 React 应用程序非常复杂,以至于新开发人员无法跟上代码。借助 Vue,初级和高级开发人员之间的差距缩小了,他们可以更轻松地进行协作,并减少 bug、问题和开发时间。

    有些人声称他们在 React 中所做的事情在 Vue 中可以写的更好。如果你是一位无经验的 Javascript 开发人员或者如果你在过去十年中主要使用 jQuery,那么你应该考虑使用 Vue。Vue 看起来更像是简化的 Javascript,同时也引入了一些新的想法:组件,事件驱动模型和单向数据流,它的体积也很小。

    同时,Angular 和 React 有自己的做事方式。他们可能会阻碍你,因为你需要调整你的做法,让事情顺利进行。这可能是一个不利因素,因为你不够灵活,而且学习曲线陡峭。这也可能是一种好处,因为你在学习技术时被迫学习正确的概念。借助 Vue,你可以用老式的方式来完成这些事情。这在开始时会更容易,但如果事情做得不好,可能会长期成为问题。

    当涉及到调试时,React 和 Vue 的戏法减少了。寻找错误更容易,因为有更少的地方可以查看,堆栈跟踪在它们自己的代码和库的代码之间有更好的区别。 使用 React 的人员报告说,他们永远不必阅读库的源代码。但是,在调试 Angular 应用程序时,通常需要调试 Angular 的内部以了解基础模型。从好的一面来看,从 Angular 4开始,错误信息应该更清晰,更具信息性。

    2.12Angular,React 和 Vue 的底层

    你想自己检查源代码吗? 你想看看事情的感觉如何?你可能首先要查看 Github 库:React(github.com/facebook/react),Angular(github.com/angular/angular)和 Vue(github.com/vuejs/vue)

    产品中看到的东西也是很好的,连同底层的源代码。TodoMVC 列出了几十个用不同的 Javascript 框架编写的相同的 Todo 应用程序。你可以比较 Angular,React 和 Vue 解决方案。RealWorld 创建了一个真实世界的应用程序,并且他们已经为 Angular(4+)和 React(使用Redux)准备好了解决方案。Vue 正在进行中。

    结论

    选择框架

    React,Angular 和 Vue 都非常好,并且他们中没有一个明显高于其他人。相信你的直觉。 Javascript 生态系统中有很多嗡嗡声。在你的搜索过程中,你可能会发现很多其他有吸引力的选择。尽量不要被最新,最闪亮的框架蒙蔽。

    应该怎么选

    如果你在 Google 工作:Angular

    如果你喜欢 TypeScript:Angular(或 React)

    如果你喜欢面向对象编程(OOP):Angular

    如果你需要指导,结构和援助:Angular

    如果你在 Facebook 工作:React

    如果你喜欢灵活性:React

    如果你喜欢庞大生态系统:React

    如果你喜欢在几十个软件包中选择:React

    如果你喜欢 JS &“一切都是 Javascript 的方法”:React

    如果你喜欢真正干净的代码:Vue

    如果你想要最简单的学习曲线:Vue

    如果你想要最轻量级的框架:Vue

    如果你想在一个文件中分离关系:Vue

    如果你一个人工作或者有一个小团队:Vue(或 React)

    如果你的应用程序变得非常大:Angular(或 React)

    如果你想用 react-native 构建一个应用程序:React

    如果你想有很多跟你一样的开发者:Angular(或 React)

    如果你与设计师合作并需要干净的 HTML 文件:Angular (或 Vue)

    如果你喜欢 Vue 但是害怕有限的生态系统:React

    如果你不能决定,先学习 React 和 Vue,然后学习 Angular。

    相关文章

      网友评论

      • For_u_zzd:刚实习。。老大让我直接干angular typescript也没学过我快疯了
      • xuebimi:感谢分析。
        Howie126313:不敢不敢 我就是翻译~分析是作者分析的:joy:

      本文标题:Angular vs React vs Vue 三个框架的比较

      本文链接:https://www.haomeiwen.com/subject/otuntftx.html