優化器作用：在ast中找出靜態子樹並打上標記
好處：1、每次重新渲染時，不需要為靜態子樹建立新節點。
2、在虛擬dom中打補丁（patching）的過程可以跳過。
步驟：1、在ast中找出所有靜態節點並打上標記（static：true），若當前節點為靜態節點，則其所有子節點也需要為靜態節點。
2、在ast中找出所有靜態根節點並打上標記（staticroot：true），ast中從上往下尋找，找到靜態節點則標記為靜態根節點，由於1的特性，其子節點也為靜態節點。
判斷是否是靜態節點：當模版被解析為ast時，會根據不同的元素型別設定不同的type值
1、node.type === 2為帶變數的動態文字節點，不是靜態節點
2、node.type === 3為靜態文字節點，是靜態節點
3、node.type === 1是node為元素節點，此時需要進行分析以下兩種情況：a、是否新增v-pre指令，若是則是靜態節點（以下統稱是或不是）
b、沒有動態繫結語法（v-、@、：），沒有使用v-if、v-for或v-else指令，不是內建標籤（如slot、component），不能是元件，即標籤名必須是保留標籤，當前節點的父節點不能是帶v-for的template標籤及節點中不存在動態節點才會有的屬性，滿足以上條件則為靜態標籤。
靜態根節點注意事項：在標記過程中雖然只有乙個文字子節點的元素靜態節點或者沒有子節點的元素靜態節點也是我們要找的靜態節點，但由於這兩種型別的優化成本超過收益，所以不將其標記為靜態根節點。
Vue原始碼解析 解析器
vue原始碼解析 解析器 解析器型別 html解析器 文字解析器 注釋解析器 原理 將模版字串按照一定的條件迴圈進行切割，對切割下來的內容進行型別判斷，在生產對應型別的ast節點插入到父節點上，直到切割完畢最終生成一顆ast樹。邏輯概覽 整體邏輯 export function parsehtml ...
Vue原始碼解析
原始碼位置 src core vdom patch.js updatechildren 作用 key的主要作用是高效的更新虛擬dom，原始碼中在patch的過程中，會執行patchvnode，patchvode過程中會執行updatechildren方法，會更新兩個新舊的子元素，通過key可以準確的...
vue原始碼解析2 模板解析
從上節的第 5 步，引出模板解析，將el的所有子節點取出,新增到乙個新建的文件fragment物件中，對fragment中的所有層次子節點遞迴進行編譯解析處理。文字節點 從data中取出表示式對應的屬性值，設定為文字節點的textcontent 元素節點 獲取節點屬性，判斷是否是指令 解析指令 fu...