zxdfe / FE-Interview

Every step counts
34 stars 1 forks source link

第51题:了解Vue的diff算法吗? #52

Open zxdfe opened 2 years ago

zicuan123 commented 1 year ago

当修改了真实dom的某个节点时,就会产生新的虚拟dom,新旧虚拟dom之间存在差异,如果能快速找到它们之间的差异,就能最小化的更新视图。因此vue封装了一个方法:diff算法。diff算法的目的就是找出差异,更新视图。所以diff算法的本质就是比较两个JavaScript对象之间的差异。 diff算法的过程就是调用patch函数,比较新旧节点,一边比较一边给真实dom打补丁,在采用diff算法比较新旧节点的时候,只会在同层级比较

pinkzyz commented 1 year ago

diff算法就是虚拟新旧dom做比对时用到的,会返回一个patch对象,这个对象就是储存两个节点不同的地方,最后用patch里面记录的消息更新真实dom。