之前写了一篇前端框架的大汇总,主要介绍了当下主流的框架和其特性。最近除了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?的更多相关文章

  1. 2015年最热门前端框架React 入门实例教程

    现在最热门的前端框架,毫无疑问是 React . 上周,基于 React 的 React Native 发布,结果一天之内,就获得了 5000 颗星,受瞩目程度可见一斑. React 起源于 Face ...

  2. 前端框架对比之vue与regular(一)

    每次一写到Regular总是忍不住先介绍一下,Regualr是网易杭州研究所的一位叫郑海波的大神写的一款前端框架,目前 这款框架推广的不深,加上其和angular过于相似的框架名,导致接受力并不大,其 ...

  3. 前端框架React Js入门教程【精】

    现在最热门的前端框架有AngularJS.React.Bootstrap等.自从接触了ReactJS,ReactJs的虚拟DOM(Virtual DOM)和组件化的开发深深的吸引了我,下面来跟我一起领 ...

  4. 主流前端框架对比:Vue.js , React, Angular.js

    个人认为Vue.js的文档最恳切.我认为结合文档和遇到问题Google答案的匹配度来讲:Vue.js > ReactJS > AngularJS > Angular 2 如何使用Vu ...

  5. 高性能前端框架React详解

      前  言 React 是一个用于构建[用户界面]的 JAVASCRIPT 库. React主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图). React 起源于 Facebo ...

  6. 前端框架开始学习Vue(三)

    初步安装.与搭建    https://www.cnblogs.com/yanxulan/p/8978732.html ----如何搭建一个vue项目 安装 nodejs,,, npm i == np ...

  7. 前端框架react研究

    摘要: 最近公司要做一个嵌套在app中的应用,考虑着用Facebook的react来开发view,所以就研究了下.下面是我在开发中遇到的坑,希望能给你帮助. 项目地址:https://github.c ...

  8. 前端框架VUE----学习vue前的准备工作

    起步 1.扎实的HTML/CSS/Javascript基本功,这是前置条件. 2.不要用任何的构建项目工具,只用最简单的<script>,把教程里的例子模仿一遍,理解用法.不推荐上来就直接 ...

  9. 前端框架开始学习Vue(二)

    1 根据关键字实现数组的过滤 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  10. 前端框架开始学习Vue(一)

    MVVM开发思想图(图片可能会被缩小,请右键另存查看,图片来源于网络)   定义基本Vue代码结构   1 v-text,v-cloak,v-html命令 默认 v-text没有闪烁问题,但是会覆盖元 ...

随机推荐

  1. 微软自己的官网介绍 SSL 参数相关

    https://docs.microsoft.com/en-us/dotnet/api/system.security.authentication.sslprotocols?redirectedfr ...

  2. java.lang.NoSuchMethodError: org.hibernate.integrator.internal.IntegratorServiceImpl.<init>(Ljava/util/LinkedHashSet;Lorg/hibernate/boot/registry/classloading/spi/ClassLoaderService;)

    需要:4.3及以上的版本才能用StandardServiceRegistryBuilder() hibernate-core-4.3.11.Final.jar version:4.3 ServiceR ...

  3. C#实体对象序列化成Json,并让字段的首字母小写

    引言:最近在工作中遇到与某些API对接的post的数据需要将对象的字段首字母小写.解决办法有两种:第一种:使用对象的字段属性设置JsonProperty来实现(不推荐,因为需要手动的修改每个字段的属性 ...

  4. 【ARC074e】RGB sequence

    Description ​ 一排\(n\)个格子,每个格子可以涂三种颜色的一种.现在给出\(m\)个形如"\([l,r]\)中必须恰好有\(x\)种颜色"的限制(\(1 \le l ...

  5. 针对Weblogic测试的一些小总结(转)

    1. 管理员登录页面弱密码 Weblogic的端口一般为7001,弱密码一般为weblogic/Oracle@123 or weblogic,或者根据具体情况进行猜测,公司名,人名等等,再有就可以用b ...

  6. Linux内核分析实验四----

    一.用户态.内核态 权限分级——为了系统本身更稳定,使系统不宜崩溃.(并不是所有程序员缩写的代码都很健壮!!) x86 CPU四种不同的执行级别:0(内核态)—3(用户态) 区分方法:CS:EIP(C ...

  7. MVC中数据验证

    http://www.studyofnet.com/news/339.html http://www.cnblogs.com/kissdodog/archive/2013/05/04/3060278. ...

  8. Python 爬虫入门(一)

    毕设是做爬虫相关的,本来想的是用java写,也写了几个爬虫,其中一个是爬网易云音乐的用户信息,爬了大概100多万,效果不是太满意.之前听说Python这方面比较强,就想用Python试试,之前也没用过 ...

  9. C/C++ 多继承{虚基类,虚继承,构造顺序,析构顺序}

    C/C++:一个基类继承和多个基类继承的区别 1.对多个基类继承会出现类之间嵌套时出现的同名问题,如果同名变量或者函数出现不在同一层次,则底层派生隐藏外层比如继承基类的同名变量和函数,不会出现二义性, ...

  10. mac 安装 pecl

    下载 pear curl -O http://pear.php.net/go-pear.phar sudo php -d detect_unicode= go-pear.phar 配置和安装 pear ...