[TOC] --------- ## 虛擬DOM（Virtual DOM） ### 為什么需要虛擬DOM DOM是很慢的，其元素非常龐大，頁面的性能問題鮮有由JS引起的，大部分都是由DOM操作引起的。如果對前端工作進行抽象的話，主要就是維護狀態和更新視圖；而更新視圖和維護狀態都需要DOM操作。其實近年來，前端的框架主要發展方向就是解放DOM操作的復雜性。 在jQuery出現以前，我們直接操作DOM結構，這種方法復雜度高，兼容性也較差；有了jQuery強大的選擇器以及高度封裝的API，我們可以更方便的操作DOM，jQuery幫我們處理兼容性問題，同時也使DOM操作變得簡單；但是聰明的程序員不可能滿足于此，各種MVVM框架應運而生，有angularJS、avalon、vue.js等，MVVM使用數據雙向綁定，使得我們完全不需要操作DOM了，更新了狀態視圖會自動更新，更新了視圖數據狀態也會自動更新，可以說MVVM使得前端的開發效率大幅提升，但是其大量的事件綁定使得其在復雜場景下的執行性能堪憂；有沒有一種兼顧開發效率和執行效率的方案呢？引入Virtual DOM(虛擬DOM）。 運行js的速度是很快的，大量的操作DOM就會很慢，時常在更新數據后會重新渲染頁面，這樣造成在沒有改變數據的地方也重新渲染了DOM 節點，這樣就造成了很大成都上的資源浪費。 利用在內存中生成與真實DOM與之對應的數據結構，這個在內存中生成的結構稱之為虛擬DOM 。 當數據發生變化時，能夠智能地計算出重新喧嚷組件的最小代價并應用到DOM操作上。    * * * * * 更加深入的理解虛擬DOM，請閱讀： 深度剖析：如何實現一個 Virtual DOM 算法 （戴嘉華） https://github.com/livoras/blog/issues/13