Vue Virtual Dom 和 Diff演算法

virtual dom 作用

虛擬dom的最終目標是將虛擬節點渲染到檢視上,但是如果直接使用虛擬節點覆蓋舊節點的話,就會有很多不必要的dom操作.比如,乙個ul下有很多li標籤,其中乙個發生改變,這種情況下如果使用新的ul去替換舊的ul,因為這些不必要的dom操作而造成了效能上的浪費.

為了避免不必要的dom操作,虛擬dom在虛擬節點對映到檢視的過程中,將虛擬節點與上一次檢視所使用的舊的虛擬節點做比較,找出真正需要更新的節點進行dom操作,從而避免操作其他無需改動的dom.

虛擬dom實現

其實虛擬dom就是用js完成本來在html上的元素建立，所以我們本來所編寫的元件，也是一種虛擬dom的形式，如template：『』本身就是乙個虛擬dom實現

diff演算法在實際**中，會對新舊兩棵樹進行乙個深度的遍歷，每個節點都會有乙個標記。每遍歷到乙個節點就把該節點和新的樹進行對比，如果有差異就記錄到乙個物件中。

用一句話來說:

diff演算法就是進行虛擬節點對比，並返回乙個patch物件，用來儲存兩個節點不同的地方，最後用patch記錄的訊息去區域性更新dom。

vue Virtual DOM建立過程

vue virtual dom建立過程 在 lifecycle.js 中的mountcomponent 中定義了updatecomponent，接收 render 方法作為引數，render接收使用者傳入的render函式 在render.js中定義了 render方法，其中通過call接收rend...

OpenGL和D3D的區別

1 世界座標系 opengl為右手座標系d3d為左手座標系 2 裁剪空間 opengl中z的範圍 1.0,1.0 d3d為 0.0,1.0 3 shader shader開始是以彙編的形式出現，在推出一段時間後，就出現如下幾種類c的高階語言 注 這些高階語言會被編譯成顯示卡識別的彙編 opengl的...

D3D 9和D3D 11繪製流水線對比

繪製流水線 pipline 是圖形學程式設計中屬於各種圖形學框架的骨架。windows平台下3d遊戲開發幾乎都會用到d3d來進行遊戲引擎的設計。d3d 9是使用比較廣泛的乙個版本，d3d 9 中比較核心的就是固定渲染管線 fixed function pipline 下圖是從官方的sdk中翻譯的，從...