[前端] Virtual DOM之 Diff 演算法

解析vue2.0的diff演算法
https://github.com/aooy/blog/issues/2

snabbdom
https://github.com/snabbdom/snabbdom

Virtual DOM 背後的秘密(Diff 篇)
https://zhuanlan.zhihu.com/p/36500459

React 源碼剖析系列 - 不可思議的 react diff
https://zhuanlan.zhihu.com/p/20346379

diff 演算法原理概述
https://github.com/NervJS/nerv/issues/3

讓開發者可以通過 vue, react 自由刷新頁面且避開重大性能問題,主要就是因為 diff 會幫助我們計算出 Virtual DOM 中真正變化的部分,並再只針對該部分進行實際 DOM 操作與渲染。Virtual DOM 本質上就是在 JS 和 DOM 之間做了一個緩存,而 diff 就是針對 Virtual DOM 進行操作,通過 diff 從而保證了每次操作更新後頁面的高效渲染。

vue2.0有加入了Virtual DOM ,向react靠攏的意思。vue的diff位於patch.js檔中,該演算法來源於snabbdom,複雜度為O(n)。


#diff, Virtual DOM, Vue, React

留言