react | vue | 共同点 | 优点 | |
---|---|---|---|---|
组件化 | jsx+inline style ,把html和css都写进js中。 | template单文件组件,js,html,css都写在一个文件里。 | 拆分一个一个小的可复用和高效开发的单元;父子组件传参;状态管理;路由。 | 可复用;开发效率高;调试方便;提高可维护性。 |
虚拟DOM | dom的更新策略不同:会自顶向下全diff,重新render页面, 重新生成新的虚拟dom tree, 新旧dom tree进行比较, 进行patch打补丁方式,局部更新dom。eact为了避免父组件更新而引起不必要的子组件更新, 可以在shouldComponentUpdate做逻辑判断,减少没必要的render, 以及重新生成虚拟dom,做差量对比过程。 | dom的更新策略不同:通过Object.defineProperty 把 data 属性全部转为 getter/setter。同时watcher实例对象会在组件渲染时,将属性记录为dep, 当dep 项中的 setter被调用时,通知watch重新计算,使得关联组件更新。 | 使用了 Virtual DOM + Diff算法,最后生成render函数,执行返回vnode;diff算法思路基本相同(tag不同认为是不同节点;只比较同一层级,不跨级比较;同一层级的节点用key唯一标识,tag和key都相同则认为是同一节点。) | 减少 DOM 操作;实现高效的声明式编程;跨平台问题(一次编码,多端运行) |
数据驱动视图 | React通过setState实现数据驱动视图,通过setState来引发一次组件的更新过程从而实现页面的重新渲染(除非shouldComponentUpdate返回false)。 | Vuejs的数据驱动是通过MVVM这种框架来实现的。 |
react和vue相同和区别
最新推荐文章于 2024-10-12 10:41:56 发布