分享

Angular2 相比 Vue 有什么优势?

 quasiceo 2017-09-24


关注者
572
被浏览
81548

21 个回答

Angular2.1和Vue2.1都发布了,这个问题的答案可以更新一下了。

Angular2相对于Vue的优势在Vue2.0之后已经削弱很多了。比如SSR(Vue2已经原生支持)和全栈式框架(官方推荐Vuex+Vue-Router),native端也有阿里巴巴的weex。

但是Angular2在API设计的完整度和覆盖度上还是Vue所不能及的,主要有这么几点

1. Angular2原生Form支持:
Angular2原生的Form模块功能相当强大。除了双向绑定之类的基本功能,还能通过programatic API 控制dom元素的表单行为。也有成型API提供自定义validator。这一点Vue只有v-model和第三方库。对于后台之类的重表单应用,还是Ng2有优势。

2. 依赖注入
无论你喜不喜欢DI,这就是Angular2的强大功能之一。有DI可以在不改变代码结构的情况下完成功能替换。(如,在desktop和mobile有不同功能,可以通过注入不同service实现,而共用相同的template和directive)。Vue则需要程序员自己规划代码组织,用来支持共享组件。DI也可以用于类似module local state的功能。比如,一个视频播放控件有几个子组件完成,子组件需要分享一个状态。这一点Angular2有原生的service injection pattern。而Vue则没有官方推荐。

3. 对标准向后兼容
Angular2在一些细节上对标准有更好的支持。比如 list differ 算法中 Angular2 可以支持实现了Symbol.iterator的对象,而Vue只能支持Array。对Observable和Promise,Angular2在应用的各个地方,甚至模板级别都有支持(async pipe)。而Vue需要vue-rx等第三方库支持。Angular2的组件有shadow dom的实现可以选择,而Vue目前还没有。

4. 测试
Angular2一开始就设计好了如何对组件进行测试,而Vue组件虽然也很好写测试,但是没有官方推荐的唯一标准(当然,对视图是否需要测试还有待探讨)。

除此以外,Angular2还有一些小功能比如检验模板的类型安全(即,模板里能在编译器保证没有引用model未定义的变量),不过AoT本身似乎还没有稳定,所以不能算优势。对TS的支持也是Angular好,当然前提是你喜欢TS。

总体而言,就是Angular2里你能想到的都有了,你没想到的它也有了。框架的全面性是难以撼动的。(当然,为此也付出了相当的代价)。

=========== 分割线 ===============
以下是不靠谱的扯淡环节。主要还是说说其他优势不成立的原因。

Angular钦定的nativescript是一家保加利亚公司叫Telerik,保加利亚的程序员啊诸君识得几个啊?Facebook比起telerik不知道高到哪里去了,react-native也就那样,这么一家小公司么…当然阿里的KPI项目也差不多,两个都属于半斤八两。

说Ng2是企业维护项目比个人项目好,其实也不太靠谱。Ng2的最重要的compiler基本就是 tbosch (Tobias Bosch) 一个人写的。主要还是Ng2太复杂,没人能有大改动。

另外有人说Ng2一站式服务不需要配webpack,这基本就要废掉很多其他好用的功能。对足够复杂的应用,基本webpack的功能如import style,style extract都是很好用的。连PatrickJS gdi2290 (PatrickJS) 自己都在用webpack。但是webpack要支持Angular2自己独有的功能还是需要相当库作者努力和库使用者配置的。而Vue的webpack支持是天生的。

Ng2大小就是个痛点,45kb是经过closure compiler之后的,这就意味着你必须保证代码是严格遵从closure compiler的假设。这会使得引用第三方库比较麻烦(调用方法和区分编译目标都要注意)。Vue的设计和实现就不会需要用到closure compiler这样的东西。

其实Ng2的这些问题也正是它追求全面性导致的,为了全面就要更复杂的实现,也就更容易出问题。

Angular2 相比 Vue 有什么优势? - 匿名用户的回答 还是比较中肯的,但我也可以稍微分析一下:

1. 个人 vs. 大公司,这里直接复制黏贴我在另一个问题下的评论:

这是个常见的担忧。我其实有时候觉得一个项目人多未必就好,你如果去 Vue/React/Angular/Ember 的 GitHub issues 转转,你会发现 Vue 的未关闭 issues/bugs 是最少的,而且开过 issue 的人都知道 Vue 的 bug 通常都会在一两天之内就 fix (对数据感兴趣的可以看看 Issue Stats)。大团队的开发效率真的高吗?看看 Angular 2 和 Aurelia 开发了这么久都迟迟处在 beta 状态,你真的对他们的开发效率有信心?我也参与 Meteor 的维护,深知一个庞大的项目在多人参与之后反而对于 issue 的定位、分配、修正速度有多大的影响,正因为 Vue 是我一个人的项目,我对任意一段代码都了如指掌,所以我修 bug 的效率是多人协作项目根本无法比较的。

另一方面,敢不敢依赖个人项目其实完全取决于团队对风险的容忍度,以及觉得项目的开发者靠不靠谱。你看 Laravel / Express / Backbone / Babel / CoffeeScript / Browserify / Webpack / Less / PostCSS / jspm 其实都是一人主导的项目,大家不照样用得风生水起?所以非要拿这个说事儿其实也不全面的。(update: 现已全职开发 Vue)

2. 第二点没错。不过 ng2 + NativeScript 到底好不好用还是个未知数,另一方面可以看看 Weex 到底怎么样。(update: Weex 已支持用 Vue 2 作为 runtime,合作进行中)

3. 所谓原生的服务端渲染,只要我写一个不就行了吗 -.- 虽然 Vue 的核心实现和 DOM 强耦合,但也不是没有解决办法。(update: Vue 2 已支持)

4. 不觉得多语言算是个优势,最多算是个特点吧。见仁见智了。其实用 TypeScript 写 Vue 的人也不少(DefinitelyTyped 上有 Vue 和 vue-router 的 d.ts),Dart 么... 呵呵。另外 *.vue 文件支持用第三方预处理器写模板和 CSS,ng2 就做不到,这一点我反倒觉得是 Vue 优势。(update: Vue 2 全家桶自带官方 typings)

5. Vue 在最佳实践下需要手动使用 setter 的场景其实非常少,这和对象复杂不复杂没有关系,只和你有没有正确地声明初始数据有关系。ng2 虽然有 zone.js,但是对于不是从 ng2 所控制的范围内触发的变动,ng2 依然不能检测到。换句话说,数据操作必须是从 ng2 自身的方法或是事件侦听函数中开始,才能享受 zone.js 的便利。相比之下在 Vue 中,响应化以后的数据可以独立于 vm 之外被单独任意操作,这就使得和第三方数据源的整合可以和组件解耦。(update: ng2 Zone.js 是个坑 https://www.zhihu.com/question/53022579/answer/133298778?group_id=787208004360470528#comment-192481566)

6. 性能这一点直接下这样的结论并不全面。不妨给几个跑分链接看看?在我看到的跑分数据里 ng2 除了超大量表单 (10k+ cells) 的首屏渲染有明显优势外,其他情况下也就是比 Vue 快那么一丢丢而已。另外大部分跑分的场景都是不全面的,尤其是脏检查的短板(大量 watcher + 小量数据热更新)很少有在跑分里出现,而这恰恰是 Vue 的长处。最后,别忘了 ng2 那 500kb minified 的大小。(update: 基于 krausest/js-framework-benchmark Vue 2 确实比 ng2 性能略优)

好像偏题了,如果说 ng2 真的对于 Vue 有什么优势的话,可能还是上面所提到的第二点吧。

最后,这种比较其实没啥大意义,如果你对服务器渲染/原生移动有硬需求,那还不如上 React。抛开硬需求之外,那就是看哪个更符合你/你的团队的开发习惯,更能提升效率,这个你靠别人给你指点显然没用,自己试试就知道。
Vue是模块化Web开发的轻量级方案。Angular2很可能是未来Web开发的标准方案,TypeScript,Web Component,Observable,DI。
客观的说
  1. ng2的很大优势是ts而不是框架本身
  2. ng2因为google的原因,社区肯定比vue强大,可用的各种组件肯定比vue要多,毫无争议
  3. ng2和vue在解决ng1的问题的方向上几乎是一致的
  4. 移动端,h5解决方案和web框架基本无关,native bridge 的可行性绝对不应该左右对web框架的评判,那个是锦上添花的东西。
  5. 在实际应用上,能体现出两者之间绝对差距的场景不超过10%,组件化的MVVM能解决的两个框架都能解决,不能解决的依然不能解决(vuex可观望)

angular的开发者能跟你们在知乎谈笑风生么?

刚刚结束了 NG-CONF 2016,Angular 2 发布了 rc 版本,所以来更新下这个答案。。

1. ng2 的大小问题已解决

最新版本的运行时大小比较(min + gzip)
  • ng1: 55kb
  • ng2: 45kb
  • vue: 29kb

Angular 2 现在可以通过 Offline Compile 节约大量的运行时大小(同时还有首次渲染时间)。

虽然仍然稍微比 Vue 要大,但是最为一个大而全的一体化解决方案性价确实是很高了的。


2. ng2 有更加广泛的多端支持

最新的官方支持实现有:

目前来说的话,对 Vue 而言,SSR 是没有的(虽然 Vue 2 支持起来可能不难),React Native 是没有的(虽然说有 Weex,但是对于国内的 KPI 项目又出的这么慢可能要考虑下生态问题,而且 Vue 并没有实现核心逻辑与渲染逻辑分离,Weex 到底是 Vue 的多端实现支持还是一个和 Vue 相似 API 的另一个框架都有存疑),移动端 Hybrid 也没有 Ionic 这样现有的简单解决方案(当然自己基于 Cordova 搭建也是可以的)。

3. Angular 2 也有了自己的 CLI 工具

这个只是刚刚扯平,Angular CLI,Vue 也有。


4. Angular 2 更加测试友好

Angular 2 提供了各种 Helper Function,在测试中可以更加简洁高效,便于细粒度控制。


5. Angular 2 更加工具友好

Angular 2 的主体是的 JavaScript(TypeScript),而 Vue 的主体是 HTML(Vue),前者可以较为方便地使用现有工具完成代码提示、代码检查等,而后者往往需要额外的编辑器或 IDE 插件支持。



PS:个人项目和大公司主导项目本身并没有什么优劣之分,尤老师说的个人项目的自由度更高当然是对的,但是精力有限确实也是客观的事实,比如 Google 现在基本是要把 Angular 2 从 Framework 做成 Platform,从工作量级上这个程度个人确实是很难实现的。




--- 原回答---

截至回答时的问题为:
Angular2 相比 Vue 有什么优势?

所以问题要求就是只谈优势,并不是客观的对比。(只针对框架本身)

1. Angular2 由 Google 主导,而 Vue 由个人主导。
并不是说能力方面,但考虑到个人的经费和精力等多方面原因,团队项目要比个人项目在多方面因素上更为靠谱。

2. Angular2 旨在提供通用的【前】端方案,而 Vue 仅专注于 Web。
作为框架而言 Angular2 在实现上具有更高的抽象层次,不仅可以开发 Web 应用(面向 DOM),还可以开发客户端应用(面向 Native UI),比如搭配 NativeScript。

3. Angular2 有原生的 Isomorphic 解决方案,而 Vue 只能靠第三方库或服务。
服务器端渲染可以提供良好的 SEO 以及首页加载的性能优化,而 Angular2 有官方提供的服务器端渲染支持,可以解决 Vue 等纯前端框架无法解决的痛点。

4. Angular2 具有更广泛的开发语言支持,而 Vue 只有 JavaScript 支持。
Angular2 官方提供 TypeScript、JavaScript 以及 Dart 的开发支持(不同的分发版本,不同的文档),并且能够在行为和形式上基本保持一致性(几乎相同的 API)。而 Vue 本身只有 JavaScript 支持,其他语言只能单纯靠编译到 JavaScript 实现。

5. Angular2 的数据绑定在使用上更为简单。
Angular2 支持绑定到任何普通的 JavaScript 对象,并且不会对对象造成任何改变,通过 zone.js 实现任意位置的异步操作后的数据自动同步。而 Vue 对于一些复杂对象的复杂操作,需要手动调用 setter 来通知 Vue 进行更新,操作上更为复杂。

6. Angular2 的综合性能确实比 Vue 更好。
参见各种跑分。

7?. 使用 Angular 2 更有助于淘汰落后浏览器,促进社会进步。
RT。

8?. Angular2 的最新版本号约是 Vue 的两倍,更具气势。
RT。

9?. Angular2 仍然在 Beta 阶段,相对于 Vue 而言具有更多找 BUG 发 PR 的机会。
RT。

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多