snabbdom

diff算法的基本步骤:

1、用js对象来描述dom树结构,然后用这个 js对象来创建一棵真正的dom树,插入到文档中
2、当状态更新时,将新的js对象和旧的js对象进行比较,得到两个对象之间的差异
3、将差异应用到真正的dom上

createElm 函数

首先会调用元素的init hook, 接着会存在三种情况:
1、如果当前元素是注释节点,会调用createComment 来创建一个注释节点,然后挂载到vnode.elm
2、如果不存在选择器,只是单纯的文本,调用creatwTextNode来创建文本,然后挂载到vnode.elm.
3、如果存在选择器,会对这个选择器做解析,得到tag、id、class,然后调用createElement 或createElementNS 来生成节点,并挂载到vnode.elm。

patchvnode 函数

这个函数做的事情是对传入的两个vnode做diff,如果存在更新,将其反馈到dom上。

你可能感兴趣的:(snabbdom)