核心内容: 以虚拟dom(vnode)描述真实dom
- h()创建节点
- init设置模块,生成patch函数
- patch对比dom差异,将差异更新的到dom中
官方文档https://github.com/snabbdom/snabbdom
中文文档https://github.com/coconilu/Blog/issues/152
patch函数
是snabbdom的核心函数,可以理解为对新旧dom进行差异化的函数,会返回一个新的虚拟节点
大致流程如下
- 对比新旧节点是否相同节点,(判断key和sel)
- 如果不是相同节点,则删除旧的节点,重新渲染
- 如果是,则判断新的节点是否有text,且与旧节点的text不相同,则更新文本
- 如果新节点有children,则判断子节点是否有变化,判断子节点时使用diff算法
- diff工程只会进行同层级的比较