zoukankan      html  css  js  c++  java
  • Vue与React比较

    与React
    相似:
    (1)虚拟DOM(Virtual DOM)
    虚拟DOM的诞生是基于:改变真实的DOM状态远比改变一个JS对象的花销要大的多。
    虚拟DOM是一个映射真实DOM的JS对象,当有变化产生时,就会创建一个新的虚拟DOM对象,计算新旧Virtual DOM的差别,然后把这些差别应用在真实的DOM上。
    虚拟DOM的本质是嵌套着数组的原生对象,当新一项被加进当前JavaScript对象时,一个函数会计算新旧Virtual DOM的差异且反应在真实的DOM上。高性能框架提供了计算这些差异的算法。(核心)
    Vue在渲染过程中会跟踪每一个组件的依赖关系,不需要重新对整个组件树渲染,Vue默认进行了优化;
    React每当应用的状态被改变时,全部子组件都会重新渲染,可以通过shouldComponentUpdate(一种生命周期方法)来进行控制,以避免不必要的渲染开销。
     
    (2)可视化组件
    组件化应用:把一个应用拆分成功能明确的模块,每个模块之间通过某种方式互相关联
    (3)都提供了路由和状态管理模块
     
    不同:
    (1)模板与JSX
    最大的区别是模板不同,Vue模板近似常规的HTML,使用HTML模板进行渲染,把html、css、js组合到一起,用各自的处理方式,提供了模板引擎处理
    React推荐使用JSX--一种JS语法扩展(JS混杂着XML语法),使用编程思维书写模板,思路是all in js,用JS生成html,用JS操作css;JSX实际是React对HTML的封装
     
    (2)对象属性 vs 状态管理
    Vue中state不是必须存在的,数据由data属性在Vue对象中管理,data可以保存数据;vuex是大型复杂应用的状态管理方案;每一个 Vuex 应用的核心就是 store(仓库)。“store”基本上就是一个容器,它包含着你的应用中大部分的状态;
    Vuex 的状态存储是响应式的。当 Vue 组件从 store 中读取状态的时候,若 store 中的状态发生变化,那么相应的组件也会相应地得到高效更新。
     
    React的state对象在应用中不可变,需要使用setState()方法更新;React中的Redux被设计为管理一个全局state对象/Flux
     
    (3)React Native 与 WEEX
    React Native能在手机上创建原生应用;
    Vue后与阿里合作开发Weex;
     
    (4)扩展
    在路由库的问题上,React 选择把问题交给社区维护,因此创建了一个更分散的生态系统。但相对的,React 的生态系统相比 Vue 更加繁荣。
    react中,需要引入react-router库,使用时,路由器Router就是React的一个组件。Router组件本身只是一个容器,真正的路由要通过Route组件定义,Route组件定义了URL路径与组件的对应关系。你可以同时使用多个Route组件。
     
    Vue 的路由库和状态管理库都是由官方维护支持且与核心库同步更新的;使用 Vue.js ,我们已经可以通过组合组件来组成应用程序,当你要把 vue-router 添加进来,我们需要做的是,将组件(components)映射到路由(routes),然后告诉 vue-router 在哪里渲染它们。
     
     
  • 相关阅读:
    spring boot 中@Mapper和@Repository的区别
    yarn和npm的对比以及yarn的使用
    vue环境搭建
    小白的springboot之路(六)、跨域解决方案CORS
    DWR3.0框架入门(1) —— 实现ajax
    DWR3.0框架入门(3) —— ScriptSession的维护及优化
    DWR3.0框架入门(2) —— DWR的服务器推送
    Freemarker入门案例
    dom4j生成和解析xml文件
    struts2拦截器-自定义拦截器,放行某些方法(web.xml配置)
  • 原文地址:https://www.cnblogs.com/CarrotHu/p/10824745.html
Copyright © 2011-2022 走看看