虛擬dom(virtual dom) 是 JS對象
虛擬dom就是一個真實dom的JS對象，很像 AST 抽象語法樹的概念
以前沒有虛擬dom，如果需要比較兩個頁面的差異，我們需要通過對真實dom進行比對。
真實dom節點是非常復雜的，它里面會綁定的事件，它會有屬性，背后會有各種方法，所有兩個真實dom比對，非常耗性能。
於是將dom對象變成了JS對象，JS對象就沒有亂七八糟的dom身上的特性。
單純的比較JS對象就比較快，有效的提高了react的性能。測試兩個dom通過遞歸方法進行比對，結果很慢。
如果 key 值相同 dom 就可以直接復用了，就不用重新創建dom了。
而且只要key相同，就這兩個進行比，不需要循環進行比較。
diff 算法，如果一層節點發現有問題，就不在往下比了，同層比對，該放棄就放棄，將算法復雜度，從平方降到了n，降了一個維度。
注：
我們常用的瀏覽器就是通過將js代碼轉化為抽象語法樹來進行下一步的分析等其他操作。所以將js轉化為抽象語法樹更利於程序的分析。
如圖：
如上圖中的變量聲明語句，轉化為AST之后就是右圖的樣子。
先來分析一下左圖：
var 是一個關鍵字 AST是一個定義者 = 是Equal 等號的叫法有很多形式，在后面我們還會看到 “is tree” 是一個字符串 ；就是 Semicoion
再來對應一下右圖：
首先一段代碼轉化成的抽象語法樹是一個對象，該對象會有一個頂級的type屬性'Program',第二個屬性是body是一個數組。
body數組中存放的每一項都是一個對象，里面包含了所有的對於該語句的描述信息
type:描述該語句的類型 --變量聲明語句
kind：變量聲明的關鍵字 -- var
declaration: 聲明的內容數組，里面的每一項也是一個對象
type: 描述該語句的類型
id: 描述變量名稱的對象
type：定義
name: 是變量的名字
init: 初始化變量值得對象
type: 類型
value: 值 "is tree" 不帶引號
row: "\"is tree"\" 帶引號
.