都 9012 了，该选择 Angular、React，还是 Vue？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 2076 天前的主题，其中的信息可能已经有所发展或是发生改变。

转载请注明出处：葡萄城官网，葡萄城为开发者提供专业的开发工具、解决方案和服务，赋能开发者。

尽管 Web 开发的典型应用场景除了将服务器用作平台、浏览器用作客户端之外，几乎很少活跃于其他业务领域，但不可否认 JavaScript 语言和框架的使用已经成为了主流。Angular、React 和 Vue，作为 JavaScript 的三大框架已逐步发展成熟，三者的差异性也越发明显，假设 JavaScript 还会继续流行十年左右，未来十年，你将会作何选择？

Angular

AngularJS 自 2009 年诞生，至今已有十年历史。在这短短十年中，其对 Web 社区的发展产生了十分深远的影响。作为一款优秀的 JavaScript 框架，在其推出一年后，便在全球引起了广泛关注，如今更是在 Google 的 600 多款产品中得以成功运用，如 Firebase 控制台、谷歌分析、谷歌快车、谷歌云等。

AngularJS 有着诸多核心特性，包含：MVC （ Model – view – controller ）、模块化、自动化双向数据绑定、语义化标签、依赖注入等。Angular 最新版 7.0.0 已于 2018 年 10 月发布，下一版本预计将于今年第二季度正式上线。以下是 Angular 7 针对性能、命令行工具和 Material Design 组件的优化项：

性能方面：Angular 7 新增的虚拟滚动优化了单页面的呈现方式，对于那些吸引访问者继续向下滚动的 clickbait 网站来说，这将派上大用场。Angular 7 的另一个性能亮点被称为 Bundle Budgets，它用于预警开发人员当前使用的 JavaScript 包的大小，当 JavaScript 包超过 2MB 时开始预警，在达到 5MB 后直接中断生成。
命令行提示：当在 CLI 中键入某些命令，如 ng new 或者 ng add @angular/material 时，Angular 7 会提示用户，让你找到像路由或 SCSS 支持之类的内置特性，从而简化编码体验，帮助开发者发现新功能或提供灵感。
视觉风格：谷歌在 Angular 7 之前已于 2018 年更新了 Material.io ，用户更新后会出现细微的视觉差异：如，UI 结构层次更为大胆、形状的边角更加圆滑，五种全新的 Icon 样式，以及一个非常时尚且现代化的拖放模块。

React

Angular 的出现，在 Web 社区引发了强烈轰动。两年后，Facebook 也推出了一款同样具备丰富功能的 JavaScript UI 组件库—— React。

使用 React，意味着您将用一种更简约的方式开始前端开发，这也是大部分开发人员所期待的：

没有依赖注入
使用 JSX （一种基于 JavaScript 构建的类似 XML 的语言），而非经典模板，创建虚拟 DOM
使用状态管理 setState 和 Context API
XSS 保护
用于单元测试组件的实用程序

不多，却正好够用，您完全可以根据自己的需要，自由添加任何组件库，它们包括：

路由：React-router
获取 HTTP 请求：Fetch （或 axios ）
各种各样的 CSS 封装技术
用于单元测试的 Enzyme Google 和 Facebook 作为 Web 社区开源项目的主要发起者，彼此之间从未停止过竞争，尤其是关于 Angular 和 React 之间的辩论已经持续了四年之久。但严格来说，将 Angular 与 React 进行比较并不完全公平，因为 Angular 是一个功能齐全、组件丰富的框架，而 React 只是一个 UI 组件库。为了解决这个问题，我们将就 Angular 框架中的一些常用组件库与 React 进行对比。

组件功能：React VS Angular

Angular 提供了比 React 更多开箱即用的功能，如：

依赖注入
基于 HTML 的扩展模板
由 @angular / router 提供的路由
使用 @angular / common / http 的 Ajax 请求
用于构建 @angular /forms 的表单
组件 CSS 封装
XSS 保护
用于单元测试组件的实用程序其中，依赖注入等功能作为 Angular 的核心，您无法选择不使用它们，这好像一把双刃剑，在带来强大功能模块的同时，也使得 Angular 变得越来越笨重。

当然，Google 工程师已经意识到了这个问题，也在一定程度上致力于简化 Angular 框架的复杂性，希望在 Angular 8 中能让人耳目一新。

Vue

在 React 与 Angular 孰优孰劣的讨论逐步升温的时候，另一个 JavaScript 框架 Vue 抵达了现场，使得这场最优 Web 开发框架的角逐变得更加白热化。

Vue.js 是由 Google 的核心开发工程师——尤雨溪（ Evan You ）所创建的框架，作为一个比 React 和 Angular 都更年轻的框架，Vue 从它们那里借鉴了好的部分，即函数式和面向对象编程的混合体。2014 年 2 月（在微软收购 GitHub 平台四年之前），Evan You 在 GitHub 上发布了第一个稳定版本的 Vue，标志着一个构建数据驱动的 Web UI 的渐进式框架就此诞生。

尽管没有得到谷歌和 Facebook 等科技巨头的支持，但自 2018 年以来，Vue 一直受到开发者的广泛关注。从去年几大主流前端开发框架的热度来看，大多数知晓 Vue 的开发者都表示有兴趣学习它。

也许，那些已经熟练掌握 Angular 和 React 前端框架的开发人员也应该花些时间去了解一下这个简单、小巧、省心的前端框架，希望下面的内容能对你有所帮助。

学习曲线：React VS Vue

如果前端框架的学习不包含 TypeScript （即便 TypeScript 通常被认为是 JavaScript 的增集，但要完全掌握仍需要学习额外的类处理过程），那么 React 和 Vue 的学习速率都高于 Angular。

相对于 React，许多初学者认为 Vue 的学习成本更低，因为它提供了更加丰富的资源文档和中文支持。事实上，Vue 和 React 学习速率的实际情况是大致相同的，由于大部分 Vue 的学习资料直接以单个 Web 应用程序的开发实践开始，直观且清晰的代码逻辑的确可以帮助初学者更快入门，但是，随着学习内容的深入，当您需要开发复杂的 Web 应用程序时，花哨灵活的指令和逻辑反而会让人觉得 Vue 比 React 更难掌控。

技术社区：React VS Vue

React 是一个已经存在近十年的 Facebook 开源项目，因此它拥有更加成熟的技术社区支持。尽管 Vue 已经成功地在短短几年间吸引了相当多的追随者，但在它真正建立出一整套完善且丰富的生态系统之前，仍需要更多人和时间的打磨。

当你看到许多使用 Vue 完成的项目时，你会注意到，其整体的设计理念更趋向现代化，这是因为 Vue 仍是一个相对较新的框架，比如，这个示例。众多周知，React 所包含的工具、组件库和代码包的数量更多，但 Vue 灵巧、精致和简单却更加令人印象深刻。

安全性：React VS Vue

前端几乎无安全可言！当然，这里所指的安全性，仅仅是 React 和 Vue 这两个框架之间的对比，相对于 React，Vue 更为小众且不同，因此在面对大规模黑客攻击的时候，React 更容易成为目标。

Vue 和 React 同样都容易受到跨站点脚本（ XSS ）攻击，这也是 Web 应用程序中最为常见的安全漏洞。XSS 攻击允许攻击者将客户端脚本注入到其他用户查看的网页中，以影响其关联的任何 JavaScript Web 应用程序。 PS：缓解此问题的最佳方法是将数据保存在脚本之外，加入黑名单机制并从白名单中进行数据验证。

灵活性：React VS Vue

这也是争议最大的地方。React 专注于 UI，所以在构建 UI 组件时可以从它那里获得很好的支持。Vue 作为一个渐进式框架，只允许使用最基本的功能来构建应用程序，但同时也提供了一些开箱即用的东西：如，用于状态管理的 Vuex、用于应用程序 URL 管理的 Vue Router、Vue 服务器端渲染。

Vue 剥离了许多元素，相比之下 React 更加全面。但如果您正在寻找一种精简、新颖、简单易学、样板代码少、高性能、灵活且完整的前端框架，Vue 更加适合；当然，如果您打算使用低版本 jQuery 代码，Vue 也同样支持。

React 的灵活性则更多依赖于其背后强大的技术社区，在 Facebook 的强力支撑下（ Facebook 的 React 团队包括了 10 名专职开发人员），提供了更多工具、UI 库和教程。

如果您的开发理念更趋向全栈文化、跨平台、保持独特、引领潮流而不是跟随，那么您一定会喜欢 Vue ；但如果您的项目需要大量熟练使用该框架的前端开发者、大量的工具及第三方库，那么您最好使用 React。不过小孩子才做选择，您最需要的应该是一个全面兼容 Angular、React 和 Vue 的前端开发工具包—— WijmoJS。

Vue 的未来

截至 2019 年初，Angular、React 和 Vue 之间的竞争持续升温，越来越多的开发人员开始抛弃 Google 项目，就商业开发工具的提供者而言，Vue 的未来一片光明。

为开发速度更快的 Web 应用程序而选择了 Vue 的人有明显的增长，Vue 很有趣，开发起来也很简单。虽然，React 依托于其庞大的生态圈，在目前为止，处理更复杂的 Web 项目时占据优势，但随着前端社区内大量 Vue 追随者的出现、Vue 社区稳定增长的良好氛围，都在暗示着 Vue 很快就会变得像 React 一样受欢迎。

Angular、React，还是 Vue ？

作者尽量保持着公正的态度，客观地分析了上述三个前端框架，而作为前端开发者，面对 Angular、React 和 Vue，你会作何选择？为什么？如果您有任何问题或意见，欢迎在文末回复讨论。

76 条回复 • 2020-07-07 18:00:52 +08:00

xjr7670

2019-04-18 16:16:30 +08:00

我就想问，作为一个业余的前端开发者，该学哪个

jacketma

2019-04-18 16:19:22 +08:00 via Android

支持 vue 吧，难得一个国人高 stars 项目

wozhizui

2019-04-18 16:25:37 +08:00

难道不是全都用点吗

famensaodiseng

2019-04-18 16:29:15 +08:00

不要给我说什么 jquery,vue,angular,老夫 jquery 一梭子。

samleong019

2019-04-18 16:29:25 +08:00

@xjr7670 学 react, 学会 react 上手 vue 分分钟的事, angular 在国内不好找工作...

AngryMagikarp

2019-04-18 16:37:54 +08:00

vue 已经不小众了，至少在国内人们都跟风去用 vue 了。

strpbrk

2019-04-18 16:46:43 +08:00

react

slimyy

2019-04-18 16:47:42 +08:00

jquery 一梭子

pkoukk

2019-04-18 16:49:58 +08:00

对于我这种上了年纪的后端，问就是 jquery 一梭子

GTim

2019-04-18 16:52:13 +08:00

公司项目请用 VUE，好招人
个人研究请用 React

热血沸腾请用 Angular

leonidas

2019-04-18 16:53:57 +08:00

jquery 是被抛弃了吗

atom234

2019-04-18 16:55:17 +08:00

只会 jquery

buhi

2019-04-18 16:57:32 +08:00

要保证项目质量的话用 react+typescript
不用 typescript 的话稍微大一点的项目都很容易写成一坨浆糊

rrfeng

2019-04-18 17:16:04 +08:00 via Android

作为一个只会用 Angular 的运维来说我是不是太奇葩了？

而且明明 Angular 好用啊！

CallMeReznov

2019-04-18 17:26:35 +08:00

@rrfeng #14 同为运维.
我学了 python 作为补充,现在犹豫要不要在学一门前端语言.
angular 和 vue 都简单看了一下感觉没什么学下去的动力
在运维工作中前端语言有什么用处呢?

Mexion

2019-04-18 17:36:29 +08:00 via Android

React 和 Vue 个人用起来比较喜欢 Vue，Angular 没用过

zhuangzhuang1988

2019-04-18 17:37:31 +08:00

jquery 一把梭

rrfeng

2019-04-18 17:43:38 +08:00 via Android

@CallMeReznov
总有用处，比如可以硬怼前端的 bug 😃（误

写界面啊，总有那一天的。脚本只是初级

sanqian

2019-04-18 17:50:37 +08:00

jquery 一把梭

lzj307077687

2019-04-18 17:52:07 +08:00

jquery 一把梭

xrr2016

2019-04-18 17:59:09 +08:00

3 个框架都用过的表示，还是用 Vue 吧，简单易上手，cli 工具好用，国内用的人多，文档不错，学习资源也多，3.0 要用 Typescript 重写。

passerbytiny

2019-04-18 17:59:57 +08:00

打擦边球搞推广的，貌似也没达到封号的必要性，所以我干脆 block 了。

zt1991616

2019-04-18 18:00:31 +08:00

vue react 都不错

agdhole

2019-04-18 18:01:15 +08:00

因为 vuetify 我用 vue,其他时候会选择 angular,react 太灵活太自由,不适合我(😀

stabc

2019-04-18 18:02:37 +08:00

react 好处是可以顺道连 react native 一起搞了

joesonw

2019-04-18 18:06:25 +08:00

活动页, 小页面 vue 来的快. 大项目还是 react. 都试试就知道了.

colorcat

2019-04-18 18:28:47 +08:00

大项目 Angular，中项目 React，小项目 Vue

loading

2019-04-18 18:39:44 +08:00 via Android

我选 jQuery

dsg001

2019-04-18 18:53:04 +08:00

jquery +1

Jossss

2019-04-18 18:56:03 +08:00

推广不发推广节点？

sighforever

2019-04-18 18:57:12 +08:00

国内 vue，国外 react

beginor

2019-04-18 19:03:04 +08:00 via iPhone

坚定不移 Angular

DOLLOR

2019-04-18 19:20:40 +08:00 via iPhone

老子直接上 vanilla.js ，这才是永远不会过时的技术，什么 jquery 就是个弟弟😋

lastpass

2019-04-18 19:36:43 +08:00 via Android

当然是 vue

wc951

2019-04-18 21:40:21 +08:00 via Android

java 程序员就直接上 angular 吧

mingyun

2019-04-18 22:06:51 +08:00

jquery 一把梭+1

ironMan1995

2019-04-19 00:23:08 +08:00 via Android

vue 和 react，个人比较喜欢 react。刚开始用的 vue，等用 react 的时候，真的感觉很爽，不知道为什么

dodo2012

2019-04-19 00:28:36 +08:00

@ironMan1995 和你一样的路子，先用的 vue，后来用的 react，我觉得 react 的概念更少些，加上 jsx 的自动补全真的爽，vue3 支持 ts 后应该会好些

sunzhenyucn

2019-04-19 00:46:44 +08:00

都 9012 了还在纠结这个问题

jinliming2

2019-04-19 00:50:25 +08:00 via iPhone

原生的 Web Components 会是官方支持的未来，只是现在 HTML Imports 被弃用暂时替代解决方案 ES Module 还不太成熟（ ES Module 已经比较成熟，但是应用在 HTML Imports 相关方向时暂时还没有比较好的实践，得继续观望）。
而 React VUE Angular 这些第三方框架的必然会在未来 Web Components 成熟后采纳一些原生的解决方案。
比如样式隔离问题，现在三大框架的解决方案只有两种，一种是给样式 class 类名加 hash，一种是加前缀，各个子组件不使用 id，以保证在复杂庞大的页面下样式互相不冲突，带来的问题就是样式类名又臭又长，或是太过随机。而原生的 Web Components 则在浏览器层面直接对样式进行隔离，不同子组件之间样式 class、id 都可以冲突而不相互受影响。
还有就是未来一定会出现越来越多的基于 Web Components 的第三方框架（目前貌似就只有 Google 的 Polymer 做了好几年了比较稳定），YouTube 就是采用的 Polymer 框架，根据浏览器支持情况选择 Polyfill，目前看起来已经很成熟了。
---
前两天在看 Chrome 弃用 Web Components v0 的讨论，感觉国外在生产实践中应用这个技术的已经有很多了，以至于 Chrome 必须推迟删除 API 的决定。

vevlins

2019-04-19 00:54:06 +08:00

毫无疑问 react.
更清晰简洁的单向数据流,更强大的社区,更灵活的 jsx(vue 的 jsx 约等于💩)

当然 vue 的语法糖多不少,省的自己去实现了,mvvm 看起来也比单向数据流写的代码更少,小项目可以,大项目算了吧,不够灵活.

kid1412621

2019-04-19 01:21:51 +08:00 via Android

@wc951 什么逻辑？

ymj123

2019-04-19 02:10:26 +08:00 via Android

@wc951 同意，angular 读起来很 Java，可能是因为我兰姆达表达式比较多？

AltairT

2019-04-19 02:21:33 +08:00 via iPhone

看了你几个历史帖子，感觉你应该发到推广节点。

impl

2019-04-19 02:36:19 +08:00 via Android

react 最近新出的 hooks 挺好用

hantsy

2019-04-19 08:07:30 +08:00

对于熟悉 Backend 开发，特别 Java/Spring 那一套的，Angular 是首选，从 Java 到 Typescript，从 Spring DI 到 Angular Dependency Injection，从 Reactor 到 RxJS，几乎没有任何障碍，学习曲线最小。

另外必须提一下的是 Angular CLI，和最新的 Angular schematics 体系（很多第三方包已经支持），使用 ng add 可以完成以前很多的复杂配置过程。这是其它两种完成不具备的。

还有 Angular 是全栈的工具集，不像 React 只解决 UI Component 问题。

React 我觉得比较独特的（个人感觉也是比诡异的）是它的 jsx 模板和 props 设计, props 能够传递 function。另外我有点不舒服的是嵌套几层的 high order functions。

我优先选择 Angular 而不是 React 的另外一个原因，React 对 ES6, Typescript 支持响应太慢，自己的 Flow 类型检测坚持那么多年还是最后放弃了。我第一次看到 React 的时候，在项目已经在使用 ES6/babel/gulp 来写 AngularJS，要回到用 ES5 写代码，实在太难受。由于当时 Angular2+的开发周期很长，顺便看其它方案，React 最终我还是选择观望。

当然现在 React 体系还是不错的, 对开发人员来讲多了一种选择。

SuperMonster009

2019-04-19 08:10:27 +08:00 via Android

当然是 Vanilla JS，哈哈

twy

2019-04-19 08:52:43 +08:00

jquery 一把梭

ourleven

2019-04-19 08:58:02 +08:00 via iPhone

Vue，不解释

qsbaq

2019-04-19 09:04:54 +08:00

jquery 一把梭

askfilm

2019-04-19 09:06:30 +08:00

jquery +1

roshad

2019-04-19 09:06:39 +08:00

jq 和 vue angular react 不是一类东西把？

kinghly

2019-04-19 09:07:05 +08:00 via Android

无所谓，都是工具

tedzhou1221

2019-04-19 09:12:00 +08:00

Vue，Java 招聘是加份项

elone

2019-04-19 09:13:43 +08:00

坚定不移 Angular，少了很多选择第三方库的头疼问题。

0xABCD

2019-04-19 09:16:42 +08:00 via Android

其实这是一个广告贴

Chenamy2017

2019-04-19 09:16:49 +08:00

我在用 vue,但真的不知道那个好

oma1989

2019-04-19 09:22:52 +08:00

angular

hjdtl

2019-04-19 09:27:30 +08:00

醉翁之意不在酒吧，建议发到推广节点

gouflv

2019-04-19 09:28:08 +08:00 via Android

我的需求: typescript、jsx、快速上手，ng 首先下场。
然后，react 和 vue 的对比:
ts 的支持: react +1
jsx 的写法: react +1
组件的声明方式: 大家都支持 class style，平手
数据响应式: vue 自带，react 需要依赖 mobx，平手
flux 的状态管理: redux 和 vuex 我都不用，忽略
脚手架和工具生态:
cra 可以说是惨败，不灵活，比如想自定义配置，需要装第三方配置工具或者 reject ；
生态更新慢，经常因为版本升级导致会和第三方库的 ts 类型冲突；
路由，rr 只能用旧版，reach router 更新慢
所以，vue +3