这是一个创建于 2914 天前的主题，其中的信息可能已经有所发展或是发生改变。
我个人理解
react 使用 virtual dom，通过对比新老的 vdom 对象，计算诸如新增，删除等等变化，应用到真实 dom 上面
但是 vue 不是通过编译模板，利用 obj 的 getter 来获取依赖，和 dom 进行绑定，利用 setter 来触发变化监听函数来更新绑定的 dom，这里的变化监听是使用 es5 原生的功能来实现的
那么 vue2 用 vdom 的意义主要是什么
上面只是我大概的了解 可能有不对的地方
有没有大神可以解释一下
 | 1 wwqgtxx 2017-12-29 15:58:00 +08:00 via iPhone 合并修改呀，说到底就是为了减少 dom 操作的次数，提高性能 |
 | 2 guomuzz 2017-12-29 16:15:02 +08:00 js 很快 操作 dom 很慢 所以就 js 搞完 一起操作 dom |
 | 3 zhlssg 2017-12-29 16:21:31 +08:00 via iPhone 服务端渲染 |
 | 4 miyalee 2017-12-29 16:22:08 +08:00 via Android 提高渲染性能 |
| 5 guomuzz 2017-12-29 16:35:44 +08:00 |
 | 6 ts8zs 2017-12-29 16:48:52 +08:00 用来 diff 使 innerHTML 操作最小化 |
 | 实质就是，对于 以下 <div> <p>圣光背叛了我</p> <p>香蕉是女孩最好的朋友</p> </div> 你去修改第一个 p 和第二个 p,要调用 dom api 两次，但是虚拟 dom 可以合并成一次，从而提高效率 对于那些拿虚拟 dom 和原生操作做对比，就和大部分性能测试一样，都是哈哈哈。 虚拟 dom 本质上追求的是 1+1 < 2 还有 vue2 为什么要引入 vdom ？绑定 getter setter 也要操作 dom 啊，还能上天怎的。 现代框架的问题 就是让很多人误解自己会写前端。 |
 | 8 xu33 OP @admos 虚拟 dom 也没法合成一次的 该操作几次 dom 还是操作几次 只是计算出哪些 dom 需要修改 在一个 tick 内集中批处理 我的意思是 vue 本身是利用 es5 对象的钩子函数特性去监听数据的变化 然后修改 dom 相当于已经对数据进行了一次 diff （只不过是 js 引擎内部实现） 然后 vdom 对比又有一次 diff （ js 框架实现） 这不是相当于 diff 了两次吗 这样做的必要性在哪里 或者说其实 vue 的 vdom 和 react 的用途不一样，不是用来 diff 的？ 有没有大神能详细讲讲 |
| 10 admos 2017-12-29 22:05:40 +08:00 via iPhone @xu33 可以合并一次的，我整个替换 div 不就合并成一次 dom api 操作了么，diff 就是来做合并的事情的，vue2 setter getter 是修改的 vdom，vdom 再 patch 到 dom 上。js 框架（不包括 vdom 的那部分）不直接修改 dom |
1 | 14 xu33 OP 有没有真懂的来说一下啊 不知道的麻烦别胡扯了 |
 | 15 shyling 2017-12-30 19:57:12 +08:00 为了 ssr 呗 |
| 18 xu33 OP 顶 |
 | 19 ooo4 2024-03-07 16:12:20 +08:00 vue 应该做不到收集 dom 级别的副作用，只能收集到组件级别 |
Select Language