Photo credit to 手寫筆記
Why we need to use Virtual DOM ?
The actual cost to manipulate DOM is highly expensive.
Therefore,for famous front-end frameworks like Vue.js and React.js
Both of them use concept of Virtual DOM.
What’s the history of Virtual DOM ?
It can be traced back to development history of MVC and MVVM patterns.
Both patterns are all created to solve webpage display,data change,and user manipulation.
And amid above 3 status, the interaction is extremely complicated.
To make interaction more easily, inventor of frameworks apply Virtual DOM.
How does Virtual DOM actually work ?
- Virtual DOM use object to describe DOM tree structure.
- While DOM element needs to be altered,no need to manipulate DOM node directly.
- Instead, use an algorithm called diff to compare the differences between new and old tree structure.
- Then update the nodes on the real DOM tree.
Additional Knowledge
Building a Simple Virtual DOM from Scratch — Jason Yu
Virtual DOM | 為了瞭解原理，那就來實作一個簡易 Virtual DOM 吧！
從頭打造一個簡單的 Virtual DOM