Virtual DOM

javaScript

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

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