【总结】前端框架:react还是vue?
之前写了一篇前端框架的大汇总,主要介绍了当下主流的框架和其特性。最近除了bootstrap,就属react和vue最为热门,这篇就主要拿这两个框架来做一下详细对比。
究竟如何正确使用?作为小白的我们从何学起比较好?带着一系列问题来看看吧。

这篇主要介绍:
1、从出身背景、优势、缺点、适合场景、开发模式、实践情况进行对比
2、相似之处
3、如何选择?
从出身背景、优势、缺点、适合场景、开发模式、实践情况进行对比
1、出身背景:
react是facebook团队开发,2013.3月发布。目前版本15.5.4(初始版本是13开头),社区较成熟,拥有更大的生态圈
vue是Evan You个人开发,2014年2月发布 vue2.0版本,生态圈较小
2、优势:
react官网推荐的三个特点如下:
- 状态机 —轻松创建交互界面
- 基于组件 —封装组件,管理状态
- 学习一次,到处使用 —跨平台
- 更大的规模、更多的使用者、更好的可测试性
- Web和原生APP
- 能提供更多支持和工具的更大的生态系统
vue 官网推荐的三个特点
- 易用 —会html、css、js即刻开始使用
- 灵活 —渐进式技术栈
- 性能 —17kb (min+gzip),渲染速度更快,体积更小
- 模板或渲染的灵活选项
- 语法以及项目设置的简单
3、缺点:
react:
- 需要转换开发模式(函数式编程)
- 学习新的概念和语法(jsx、es5/6等)
- 需要其他类库支持 (redux)
vue:
- 个人维护框架,风险可能会更大
- 社区不成熟,部分依赖开发人员更新
- 资源较少
4、适合场景
react:
- 大型复杂应用程序
- 同时适用于web端和原生APP
- 周期长,不断迭代的需求
vue:
- 模板搭建开发模式
- 周期短、小型应用程序
5、开发模式
react:
- 函数式编程(JSX)
- setState状态管理
vue:
- 模板式开发
- 属性对象
6、实践情况
react:
- 国外公司:Facebook、Netflix、Airbnb
- 国内公司:蚂蚁金服、阿里、口碑、美团、滴滴
vue:
- 主要是饿了么
相似之处
React和Vue都是优秀的UI库,并且具有更多的相似之处。它们都有的优势是:
- 使用虚拟DOM快速渲染
- 轻量级
- 响应式组件
- 服务端渲染
- 轻松集成的的路由、捆绑和状态管理
- 强大的支持和社区
如何选择?
如果是以下需求选react
1、如果想组件式开发
2、如果想web和wap统一技术栈
3、如果想要代码更可维护和可测试性
4、如果你想要最大的生态系统,想利用丰富的组件库及第三方包
5、如果你想要构建大型应用程序
如果是以下需求选vue
1、如果你喜欢使用模板( 或需要一些其中的选项)构建应用程序
2、如果是在现有代码基础上快速升级
3、如果你喜欢简单的能正常工作的,想更加灵活性
4、如果你希望你的程序更小更快,想要更快的渲染速度和体积
最后
作为刚入门的小白, 可以先学Vue,然后再在vue的基础上学习React。所以下次就说说Vue吧~
【总结】前端框架:react还是vue?的更多相关文章
- 2015年最热门前端框架React 入门实例教程
现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Face ...
- 前端框架对比之vue与regular(一)
每次一写到Regular总是忍不住先介绍一下,Regualr是网易杭州研究所的一位叫郑海波的大神写的一款前端框架,目前 这款框架推广的不深,加上其和angular过于相似的框架名,导致接受力并不大,其 ...
- 前端框架React Js入门教程【精】
现在最热门的前端框架有AngularJS.React.Bootstrap等.自从接触了ReactJS,ReactJs的虚拟DOM(Virtual DOM)和组件化的开发深深的吸引了我,下面来跟我一起领 ...
- 主流前端框架对比:Vue.js , React, Angular.js
个人认为Vue.js的文档最恳切.我认为结合文档和遇到问题Google答案的匹配度来讲:Vue.js > ReactJS > AngularJS > Angular 2 如何使用Vu ...
- 高性能前端框架React详解
前 言 React 是一个用于构建[用户界面]的 JAVASCRIPT 库. React主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图). React 起源于 Facebo ...
- 前端框架开始学习Vue(三)
初步安装.与搭建 https://www.cnblogs.com/yanxulan/p/8978732.html ----如何搭建一个vue项目 安装 nodejs,,, npm i == np ...
- 前端框架react研究
摘要: 最近公司要做一个嵌套在app中的应用,考虑着用Facebook的react来开发view,所以就研究了下.下面是我在开发中遇到的坑,希望能给你帮助. 项目地址:https://github.c ...
- 前端框架VUE----学习vue前的准备工作
起步 1.扎实的HTML/CSS/Javascript基本功,这是前置条件. 2.不要用任何的构建项目工具,只用最简单的<script>,把教程里的例子模仿一遍,理解用法.不推荐上来就直接 ...
- 前端框架开始学习Vue(二)
1 根据关键字实现数组的过滤 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...
- 前端框架开始学习Vue(一)
MVVM开发思想图(图片可能会被缩小,请右键另存查看,图片来源于网络) 定义基本Vue代码结构 1 v-text,v-cloak,v-html命令 默认 v-text没有闪烁问题,但是会覆盖元 ...
随机推荐
- vue 组件 模板中根数据绑定需要指明路径并通信父
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>T ...
- SpringBoot(六)_AOP统一处理请求
什么是AOP AOP 是一种编程范式,与编程语言无关: 将通用逻辑从业务逻辑中分离出来(假如你的业务是一条线,我们不在业务线上写一行代码就能完成附加任务!我们会把代码写在其他的地方): 具体实现 (1 ...
- spring 中 ThreadPoolTaskExecutor 的使用
配置文件代码如下: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="htt ...
- UVAlive4255_Guess
题目很好很有意思. 告诉你n个序列中,任意一个连续子序列的和与0相比较的结果. 构造一个满足条件的序列. 对于从x->y这一段的和,如果大于0,那么sum[x]>sum[y-1],显然我们 ...
- BZOJ 2143 飞飞侠(分层最短路)
飞飞国是一个N×M的矩形方阵,每个格子代表一个街区.然而飞飞国是没有交通工具的.飞飞侠完全靠地面的弹射装置来移动.每个街区都装有弹射装置.使用弹射装置是需要支付一定费用的.而且每个弹射装置都有自己的弹 ...
- P2219 [HAOI2007]修筑绿化带
我是题面 这道题跟理想的正方形很像,不大明白蛤OI是怎么想的,一年出两道这么相近的题 这道题有两个矩形,所以就有了两种做法(说是两种做法,其实只是维护的矩形不同) 一种是维护大矩形,一种是维护小矩形, ...
- IoT与区块链的机遇与挑战
区块链, 分布式账本技术的一种形式, 自从2014年或多或少地获得了大量的关注: 区块链和物联网, 区块链和安全, 区块链和金融, 区块链和物流, 凡是你能想到的,仿佛都可以应用区块链. 在本文中, ...
- php版本的code review软件
phabricator, http://www.oschina.net/p/phabricator
- struts2 的自定义 拦截器
Struts2的 拦截器: 对于拦截器,Struts2官方给出的 定义是: 拦截器是动态拦截Action调用的对象.它提供了一种机制,使开发者可以定义一段代码,在Action执行之前或者之后被调用执行 ...
- Non-Local Image Dehazing 复现
本文选自CVPR 2016, 文章链接Dana Berman, Tali Treibitz, Shai Avidan. Non-Local Image Dehazing 复现源码见我的Github 无 ...