美文网首页
Virtual DOM

Virtual DOM

作者: HelenYin | 来源:发表于2019-04-08 13:57 被阅读0次

Virtual DOM 算法:

  1. 用 JavaScript 对象结构表示 DOM 树的结构;然后用这个树构建一个真正的 DOM 树,插到文档当中
  2. 当状态变更的时候,重新构造一棵新的对象树。然后用新的树和旧的树进行比较,记录两棵树差异
  3. 把2所记录的差异应用到步骤1所构建的真正的DOM树上,视图就更新了

Virtual DOM 本质上就是在 JS 和 DOM 之间做了一个缓存。可以类比 CPU 和硬盘,既然硬盘这么慢,我们就在它们之间加个缓存:既然 DOM 这么慢,我们就在它们 JS 和 DOM 之间加个缓存。CPU(JS)只操作内存(Virtual DOM),最后的时候再把变更写入硬盘(DOM)。

还需要了解的知识:
  1. 算法复杂度
  2. 二叉树的遍历

3.文本比较算法和最小编辑距离
https://github.com/livoras/blog/issues/13

相关文章

  • virtual DOM 实现原理

    virtual DOM 实现: virtual-dom Snabbdom 对比 数据结构virtual Node ...

  • 实现简单render函数

    什么是Virtual Dom React和Vue2都使用了Virtual Dom技术,Virtual Dom并不是...

  • Day7:virtual dom & MVVM

    virtual dom 什么是virtual dom 虚拟dom 用JS模拟DOM结构 DOM变化的对比,放在JS...

  • Virtual DOM

    什么是 Virtual DOM Virtual DOM(虚拟 DOM),是由普通的 JS 对象来描述 DOM 对象...

  • Javascript 简要,你一定要看看

    1.Virtual DOM Vue 和 React 都使用了 Virtual DOM,那么什么是 Virtual ...

  • 虚拟DOM

    虚拟DOM 基础概念: virtual DOM是对真实DOM的描述和映射 当Virtual DOM改变后,我们得到...

  • 虚拟DOM

    Virtual DOM Virtual DOM,是由普通的JS对象来描述DOM对象,因为不是真实的DOM对象,所以...

  • 初探Virtual dom & diff算法

    问:Virtual dom 是什么?为何会存在Virtual dom?答:用JS模拟DOM结构。原因:1.DOM操...

  • iview表格render

    关于 RenderReact 和 Vue 2 都使用了 Virtual Dom 技术,Virtual Dom 并不...

  • JavaScript虚拟DOM

    什么是Virtual DOM Virtual DOM是对DOM的抽象,本质上是JavaScript对象,这个对象就...

网友评论

      本文标题:Virtual DOM

      本文链接:https://www.haomeiwen.com/subject/aivuiqtx.html