vue源码理解

 

 

什么是virtual-dom？  virtual-dom意义？   virtual-dom库：vue采用的是？ 

snabbdom   virtual-dom：开源库

前端演变历史：

dom操作，----》 jquery等dom操作库 -----》 模块引擎  -----》 MVVM ？？？

一：virtual-dom的意义？ 

1-  真实dom的创建成本太大！  虚拟dom来对比dom的变动，将dom的更新成本降低！   

虚拟dom：普通的javascript对象描述dom；  创建开销小很多！   只更新发生变化的，不会销毁重建；  

 let element = document.querySelector('#app')
  let s = ''
  console.log([element])
  for (var key in element) {
    s += key
  }
  console.log(s)

　　

 

一：虚拟dom
1- 创建vnode
2- 对比vnode，对比改变，更新到真实dom， 根据vnode ---》 真实dom
3- render

 

 

vue2: Object.defineProperty()

 

vue3: es6的proxy()

 

vue的那幅图的理解！   

vue边界问题的理解！ 

vue：发布订阅模式的理解！ 

 

 

 

参考学习资料：

1-  自己打印的资料

2-  拉钩买的课程

3-  去看vue源码