vue虛擬dom是什麼？vue的虛擬dom的用法
1、為什麼需要虛擬dom
雖然採用的是文件碎片，但是操作的還是真實的dom。
而我們知道操作dom的代價是昂貴的，所以vue2.0採用了虛擬dom來代替對真實dom的操作，最後通過某種機制來完成對真實dom的更新，渲染檢視。
所謂的虛擬dom，其實就是用js來模擬dom結構，把dom的變化操作放在js層來做，儘量減少對dom的操作（個人認為主要是因為操作js比操作dom快了不知道多少倍，js執行效率高）。然後對比前後兩次的虛擬dom的變化，只重新渲染變化了的部分，而沒有變化的部分則不會重新渲染。
比如我們有如下的dom結構。
varvdom = ,
children: [,},
}]
}
2、vue虛擬dom的用法
vue在2.0版本引入了vdom。其vdom是基於snabbdom庫所做的修改。snabbdom是乙個開源的vdom庫。
snabbdom的主要作用就是將傳入的js模擬的dom結構轉換成虛擬的dom節點。
先通過其中的h函式將js模擬的dom結構轉換成虛擬dom之後，再通過其中的patch函式將虛擬dom轉換成真實的dom渲染到頁面中。
為了保證頁面的最小化渲染，snabbdom引入了diff演算法，通過diff演算法找出前後兩個虛擬dom之間的差異，只更新改變了的dom節點，而不重新渲染為改變的dom節點。
我會從snabbdom的使用角度來看vue中的虛擬dom是如何完成檢視渲染的。
我們先看一下snabbdom中兩個核心api的功能。
h()函式：將傳入的js模擬的dom結構模板轉換成vnode。（vnode是乙個純js物件）
patch()函式：將虛擬的dom節點渲染到頁面中。
我們提供乙個例項來看一下snabbdom的實際作用。
change
面試 vue 什麼是虛擬dom？
官方概念 vue通過建立乙個虛擬的dom數對真實的dom發生的變化保持追蹤 一棵真實的dom樹的渲染需要先解析css樣式和dom樹，然後將其整合成一棵渲染樹，再通過布局演算法去計算每個節點在瀏覽器中的位置，最終輸出到顯示器上面。而我們所提及的虛擬的dom 則可以理解為儲存了一棵dom樹被渲染之前所包...
vue虛擬dom詳解
從 vue1.x 設計理念說起 對vue發展史比較熟悉的同學，應該知道這件事 vue1.0 並沒有虛擬dom這玩意，而是是 採用資料繫結 依賴收集的方式去觀察資料變化並保留對實際 dom 元素的引用 當有資料變化時進行對應的操作，每乙個觀測的render watcher 對應的就是乙個真實的dom節...
Vue中的虛擬DOM
眾所周知，在網頁中最大的開銷就是dom操作，dom很慢而且非常龐大。原生 js 或 jq 操作dom時，瀏覽器會從構建dom樹開始從頭到尾執行一遍流程。在一次操作中，我需要更新10個節點，瀏覽器不知道共有10個節點要更新，就會執行10次更新操作，浪費效能，使頁面出現卡頓，影響使用者體驗。於是，就出現...