【总结】前端框架: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没有闪烁问题,但是会覆盖元 ...
随机推荐
- true和false
下面这些值在JavaScript中都是falsy: false 0 (数字零) "" (空字符串) null undefined NaN (一个特殊的Number值,意为Not-a ...
- java 数据结构与算法---链表
原理来自百度百科 一.链表的定义 链表是一种物理存储单元上非连续.非顺序的存储结构,数据元素的逻辑顺序是通过链表中的指针链接次序实现的.链表由一系列结点(链表中每一个元素称为结点)组成,结点可以在运 ...
- C# Socket模拟发送接收
Socket简介 通过TCP/IP与仪器或设备通讯,在C#语言中,我们通常采用Socket.本项目是一个简单的Socket建立服务监听与Socket作为客户端请求的一个示例. 项目结构 客户端项目 S ...
- POJ1637_Sightseeing tour
给一个联通图,有的是单向边,有的是双向边,问是否存在欧拉回路. 乍一看毫无思路,可以这样来搞,对于每条无向边,我们随便指定一个方向,看看是否能够做到所有点的度数之和为偶数. 接下来,对于我们指定的边, ...
- bzoj2302-Problem c
题意 有 \(n\) 个人,从 1 到 \(i\) 编号.给每个人一个值 \(a_i\) ,他们会按编号从小到大进行如下操作:查看 \(a_i\) 有没有人,若没有就坐进去,否则查看 \(a_i+1\ ...
- Golang基础(二)
1. 条件语句 if ... else if ... else... package main import "fmt" func main() { { fmt.Printf(&q ...
- 【2018ICPC沈阳】
哈密顿距离转切比雪夫距离,多种颜色跟两种颜色没有区别,记录最大最小次大次小即可. 圆求交点.
- Treat wchar_t as built-in type不一致导致的链接错误
今天用VS2013新建了一个工程,生成时出现很多怪异的链接错误,比如: error LNK2019: unresolved external symbol "__declspec(dllim ...
- 【AGC010F】Tree Game
Description 有一棵\(n\)个节点的树(\(n \le 3000\)),第\(i\)条边连接\(a_i,b_i\),每个节点\(i\)上有\(A_i\)个石子,高桥君和青木君将在树上玩游戏 ...
- BZOJ5305 [Haoi2018]苹果树 【组合数学】
题目链接 BZOJ5305 题解 妙啊 要求的是所有可能的树形的所有点对距离和 直接考虑点的贡献肯定想不出,这样的所有点对距离问题通常转化为边的贡献 考虑一条边会产生多少贡献 我们枚举\(i\)节点的 ...