vue虚拟DOM 和 Diff原理

虚拟DOM概念：

用js来模拟DOM中的节点。传说中的虚拟DOM。

class Element {
   constructor(tag,ats,children){
   this.tag = tag;
   this.ats = ats || {};
   this.children = children || {}
   }
   render(){
   // 这个函数会生成真实DOM，会把render的结果添加到页面中去
   }
}

Diff原理

diff算法就是进行虚拟节点对比，并返回一个patch对象，用来存储两个节点不同的地方，最后用patch记录的消息去局部更新Dom。通俗的讲就是：diff的过程就是调用名为patch的函数，比较新旧节点，一边比较一边给真实的DOM打补丁

1、

2、

转载于https://blog.csdn.net/weixin_43638968/article/details/107907928