zoukankan      html  css  js  c++  java
  • 现代前端框架具备的特征分析及Vue、React对比

    框架或者库最早从jquery开始,我把jquery称之为传统的库。而vue、react、ng为现代化的库。
     
    jquery是2006年发布1.0版本,2013 年 5 月react开源,vue是2014年对外发版。
     
    jquery在使用过程中多半充当的是库的作用,相对现在前端框架有以下几个共同点:
    1,也可以js驱动
    2,可以模板化
     
    本文是说的特征是框架单独使用而不与webpack等工程化工具结合的时候。而现在前端框架具备的特点:
    1,一般来说是js驱动
    也就是需要挂载到dom节点上,才能发挥作用。而不是传统编程的直出。
    2,组件化
    组件化提高了复用性,提高了开发效率。
    3,单页面应用
    组件化加上路由,单页面应用是一个必然的结果。
    4,单向数据流
    单向数据流是一种数据管理方式,view只能派发action修改store,而不能直接修改。
    5,虚拟DOM
    虚拟dom降低了操作原生dom节点的代价。
    6,模板化
    7,hooks
    提高组件之间状态复用
    8,mvvm结构
     
    react和vue对比
    1,都采用了js驱动
    2,都可以实现组件化
    3,也具备单页面应用特点
    vue的store和router是作为参数传递给构造函数的,而react的store和router是作为组件包裹在dom外面的
    4,都实现了单向数据流
    vue是修改store的数据,而react返回一个新的state数据。
    这种机制背后当大数量时,react因为返回一个新数据,需要深拷贝,就会导致性能降低。所以react强调数据不可变性。所以react有了Immutable。Immutable确实对react性能做了优化,因此来说react适合大型项目,这里指的是数据量大且使用了store。
    5,虚拟dom
    vue触发虚拟dom采用的是双向数据绑定拦截触发;而react是局部更新,reactjs需要手动设置来节省更新性能。这点也是很重要的不同点。也在强调数据的不可变性。
    6,模板化
    vue使用html、css和js作为模板;而react保留了JavaScript的全编程能力,react对typeScript的支持效果更好。react使用jsx作为模板。
    vue的模板需要在components中转,但是react不需要。
    7,hooks
    vue3也开发了钩子
    8,mvvm结构

    9,react严格意义上讲只针对MVC中的view层,Vue则是MVVM模式

    10,在 Vue 中我们组合不同功能的方式是通过 mixin,而在React中我们通过 HOC (高阶组件)。其实vue中也可以使用HOC。

    11,另外 Vuex 既可以 dispatch action 也可以 commit updates,而 Redux 中只能进行 dispatch,并不能直接调用 reducer 进行修改。

    react强调数据的不变性,vue强调数据的可变性。这其实是框架设计底层决定的。这句话的意思是想要利用好react,规划的时候要做到数据的不可变性。这样才能更好的利用react。
    vue的数据的可变性,也不是所有数据都变化才好,是说vue对数据可变性支持更好,不用考虑太多的数据不可变化的问题。
    在实际使用中想要利用好react需要更好的数据不变性规划。这样也变相的提升了实际的性能。

    从某个角度讲,不管是vue还是react都是一种约定流程的开发方式。

    我站在山顶看风景!下面是我的家乡!
  • 相关阅读:
    使用js方法时,调用的方法名明明一致,但就是不管用,解决
    最近ssh遇到异常及解决
    oracle中number数据类型简单明了解释
    Struts2 使用Jquery+ajax 文件上传
    PHP学习记录(二)
    PHP学习记录(一)
    Win7下Git SSH 创建Key
    webapck基础随手记
    分享一份JS前端面试题
    Redux零碎知识点回顾
  • 原文地址:https://www.cnblogs.com/zhensg123/p/14743653.html
Copyright © 2011-2022 走看看