2017 三大框架之争(战略篇):Angular vs React vs Vue

2017年11月21日 澳洲IT圈


点击上面蓝字关注我们

封面

2017 web应用程序的 JavaScript 框架仍是主流。Angular 和 React 仍然非常流行,VueJS也越来越受关注。这篇文章将会从战略层面讨论三大框架, 文章较长,请各位看官耐心阅读。


文    | 匠游君

编辑 | Kevin Yuan

时长 | 5min


当小伙伴们build web application的时候, 如何选择一个JavaScript框架一直是一个很纠结的问题。React和 Angular一直很受大家欢迎, 最近VueJs也是发展迅猛渐渐与React和Angular形成了三足鼎立之势。


这篇文章将会从战略上讨论三大框架之争,关于技术层面的讨论将会在下期文章展示。


在两期文章中我们将讨论以下这些问题

框架/库有多成熟?
框架可能持续一段时间?
他们是相对应的社区是否是广泛而有益的?
有多容易找到的每一个框架的开发者?
框架的基本编程概念?
或大或小的应用程序中使用的框架有多容易?
每个框架的学习曲线看起来像什么?
每个框架会有什么样的表现?
你可以在哪里仔细看看这些框架under the hood?
如何开始开发你所选择的框架?



三大框架的前世今生

Angular是TypeScript-based的JavaScript框架。由谷歌开发和维护,被描述为“Superheroic的JavaScript框架MVW”。


许多小伙伴可能对Angular 和 AngularJS 有些傻傻分不清楚, 这里Kevin简单向大家介绍一下两者关系:


Angular(也称为“Angular2+”,“Angular2”或“NG2”)是重写后的,大多对于AngularJS(也称为“Angular.js”

或“AngularJS 1.x”)并不兼容。虽然AngularJS(旧版)最初发布于2010年10月,它仍然需要不断修复bug--新的AngularJS(SANS JS)在2016年9月升级为版本2,最新版本是版本5。


谷歌、Wix、weather.com、healthcare.gov和福布斯使用的是Angular。



React是“一个JavaScript库,用于构建用户界面”。最早发布于2013年3月,React是由Facebook开发和维护的,它有几个网页使用产生React组件(但不是作为一个单页的应用程序)。根据克里斯·科尔德尔的一篇文章,React更多地用于Facebook,而Angular更多用在谷歌。 


React也用于Airbnb, Uber, Netflix, Twitter,

Pinterest, Reddit, Udemy, Wix, Paypal, Imgur, Feedly, Stripe, Tumblr, Walmart等。


Facebook发布了React Fiber,它使得rendering速度快很多。 Facebook在2017年4月开发者大会上谈到了react fiber,并发布了有关新架构的一个非官方的文章。React Fiber与React16在2017年9月发布。



Vue是2016年增长最为迅速的JS框架。Vue是一个“直观,快速和可组合的MVVM用于建立交互界面。”它已经相当成功。在2016年,第2版发布了。 


使用Vue的公司有阿里巴巴,百度,Expedia,任天堂,GitLab --还有一些小项目清单可在madewithvuejs.com找到。


值得一提的是vue框架是由华人尤雨溪创造的, 他认为未来的app将会越来越轻量化和细化, 这也是vue框架的优势所在。


核心开发

如前所述,大公司都支持Angular和React的使用。


Facebook、Instagram和WhatsApp使用它们来制作自己的网页。谷歌也在很多项目使用它,例如:AdWords新界面就是用Angular&Dart来实现。Vue的小团队也是有好处的,他们的代码更简洁。


Angular,React和Vue在Github上Starts History
让我们来看看一些统计数据:Angular列出了36人在他们团队页面上,Vue公司16人,React没有团队页面。


github star数对比(下图)


在GitHub上,Angular具有超过25000 starts和463个贡献者,React有超过 70000的starts和1000多个贡献者,Vue公司拥有近60,000stars而仅有120个贡献者。你可以在Github上查看到Angular,React,Vue的Stars History。而且,Vue似乎趋势非常好。据bestof.js,在过去三个月Angular2已经达到每天平均31stars,React74stars,Vue.JS 107stars。


 npm下载数对比(下图)

从npm的package 下载量我们也可以很好的看出三个框架的发展趋势。图中蓝色代表Angular,橙色代表react,绿色代表Vue。可以看出三大框架都有着不同程度的增长,其中react在近两年增长尤其迅速。只有在2017年1月, 他们有一定程度的回落。


市场周期

因为存在不同的名称和版本,在Google Trend很难比较Angular、React、Vue。如果在“互联网与技术”分类搜索,结果是:


由于Vue在2014年之后出现的,直接比较“VueJS”

“Angular”或“React”有点不公平。


来自ThoughtWorks的Technology Radar很好的呈现了技术如何随时间变化的。Redux使用在一些ThoughtWorks的项目(https://www.thoughtworks.com/

de/radar/languages-and-frameworks/redux)。 

Vue.js是在试用阶段,它被描述为替代Angular(具有较低的学习曲线)的更灵活的选择(https://www.thoughtworks.com/de/radar/languages-

and-frameworks/vue-js)。Angular2是处于评估阶段--它尚未成功地被ThoughtWork团队使用,不强烈推荐(https://www.thoughtworks.com/de/radar/languages-and-frameworks/angular-2)。


根据Stackoverflow2017年的调查,67%参与调查者喜欢React,AngularJS是52%。 “没有兴趣”的参与者中

AngularJS (48%) vs React (33%)。 Vue均不在前10名。


再有就是statejs.com比较“前端框架”的调查。最有趣的是:React,Angular有100%的认知度,23%的被调查者不知道Vue。关于满意度,92%被调查者表示“将再次使用”React,Vue的为89%,Angular 2仅有65%。


长期的支持和迁移

React APIs是相当稳定的,Facebook用在他们的设计原则里。也有一些scripts来帮你从当前的API迁移到一个新的:check out react-codemod。迁移是很容易的,且不需要长期支持版本。在Reddit的发文中,升级从来就不是一个问题。React团队写了一篇博客文章关于他们的版本方案。


当他们加入弃用警告时,他们发布下一个版本之前仍保持它的当前版本。V14发布于2015年10月,V15发表于2016年4月,和V16发布日期未知。最近一个React核心开发人员指出升级应该不是一个问题。


关于Angular,有个关于版本和发布Angular v2版本的博客文章。每半年将有一个重大的更新,并且又会有至少半年的替换期。根据这篇文章,Angular团队已经宣布了Angular4后有长期支持版本。下一个主要版本发布前,将有至少一年的技术支持。这意味着Angular4的技术支持将会持续至2018九月(bug的修复和重要补丁程序)。在大多数情况下,从AngularV2到V4更新很简单。Angular还提供了是否需要进一步更改的信息。

Vue对于一个小应用程序,Vue1.x到2.0的更新过程应该是容易的。开发团队曾宣称,90%的API保持不变。

一位程序员指出,从V1到v2更新在一个大的应用程序没有什么好玩的。遗憾的是,有关的LTS版本的下一个版本计划还没有明确的roadmap。


另外:Angular是一个完整的框架,并捆绑了很多东西。React比Angular更加灵活,使用更加独立、快速的libraries--这也意味着你需要进行相应的更新和迁移支持,如果某些Package不再维护,试用它也可能是个麻烦。


人力资源和招聘

如果你的内部HTML开发人员不想了解JavaScript,你最好选择Angular或Vue。因为React需要更多的JavaScript。

Do you have designers working close to the code?

网友“pier25”在Reddit上评论:如果你在Facebook工作,用React很正常,在那里,每个人都是超级程序员。在现实世界中,你很难找到一个可以修改JSX的设计师 -正因为如此,用HTML模板会容易得多。

用Angular框架的好处是从另一家公司跳槽来的Angular2新程序员可以快速熟悉所有必要的conventions。React项目在architectural decisions上不同,程序员需要熟悉特定的项目设置。


Angular也不错,如果你的程序员有object-oriented背景,或不喜欢JavaScript。


从马什·钱的话可以进一步解释:

“我不是JavaScript程序员。我的背景是用“真实”的软件平台搭建大型企业系统。我在1997年开始使用C、C ++,Pascal、Ada和Fortran(......)我可以明确地说JavaScript是一堆乱码,对我而言。作为一个微软的MVP和专家,我对TypeScript有很好的理解。我也不认为Facebook是一家软件开发公司。然而,谷歌和微软都已经是最大的软件创新公司。我觉得更舒适的使用具有谷歌和微软技术背景的产品来工作会更舒适。(......)我知道微软TypeScript有甚至更大的计划。

上图是笔者刚刚在seek 上的截图,可以看出在澳洲react和angular是十分受欢迎的(约1000个左右),而Vue则是很少(不足100)。


说了这么多, 我们究竟应该选择什么js框架呢?

If you work at Google: Angular

If you love TypeScript: Angular (or React)

If you love object-orientated-programming (OOP): Angular

If you need guidance, structure and a helping hand: Angular

If you work at Facebook: React

If you like flexibility: React

If you love big ecosystems: React

If you like choosing among dozens of packages: React

If you love JS & the “everything-is-Javascript-approach”: React

If you like really clean code: Vue

If you want the easiest learning curve: Vue

If you want the most lightweight framework: Vue

If you want separation of concerns in one file: Vue

If you are working alone or have a small team: Vue (or React)

If your app tends to get really large: Angular (or React)

If you want to build an app with react-native: React

If you want to have a lot of developers in the pool: Angular or React

If you work with designers and need clean HTML files: Angular or Vue

If you like Vue but are afraid of the limited ecosystem: React


If you can’t decide, first learn React, then Vue, then Angular.


source:https://medium.com/unicorn-supplies/angular-vs-react-vs-vue-a-2017-comparison-c5c52d620176


澳洲IT求职技术群

同时除增加自己的network外,我们也组建了澳洲IT求职技术群,已经有三千多个小伙伴加入,交流技术,工作内推,欢迎做IT的朋友们加入,需要合作的也可以在后台留言。由于目前大群人数已过百,想要入群的朋友

请扫二维码入群


IT匠人暑期训练营

澳洲IT匠人的十位资深导师根据商业开发中的实际需求和澳洲人才市场中对web developer的要求,专门设计和打造了最新项目实战课程--Web开发工程师暑期强化训练营。通过此项目,IT学生可以短期内提升就业所需相关技能,并获得更多项目经验。


发扬匠人精神,精心打造Web培训课程

整合最IN技术,杜绝项目重复

让你在暑期快速积累等同一年的工作经验


咨询课程或技术交流请扫二维码

  • 回复“报名”获取报名链接

  • 回复“商业实战班”获取6+2商业实战班培训信息

  • 回复“基础班”获取基础班课程相关文档

  • 回复“入门班”获取入门班课程培训文档

  • 回复“技术交流”加入技术交流群

  • 回复“课程优惠”获取相关优惠信息

  • 回复“暑期实习”获取实习职位信息


我们是谁

布里斯班 · 悉尼 · 墨尔本· 西雅图

打造澳洲IT精英圈 · 做信息时代的匠人

澳洲IT匠人圈 - 澳洲最大的IT专业人士组织。我们的初衷就是连接海内外的IT同仁,团结互助、工作内推、职场升迁,让在土澳的我们也能感受到高科技的光芒。IT匠人圈有一系列的品牌活动:Offer收割机、大咖面对面、匠人Workshop、匠人线上公开课、品牌创业之夜,活动开展以来反响强烈。

  

让我们共同努力,一起实现梦想

欢迎各界人士的加入,合作交流请在后台留言

投稿,请联系小花或E-Mail

[email protected]

商务联系

首席勾搭官 | +61 451 010 217

首席勾搭官小花 | 微信 uniapp001

首席勾搭机器人 | 微信 irobot_wechat

欢迎关注IT匠人圈微信公众号

收藏 已赞