Vue Virtual Dom 和 Diff原理(面試必備) 極簡版


 

  我又來了,這是Vue面試三板斧的最后一招,當然也是極其簡單了,先說Virtual Dom,來一句概念:

  用js來模擬DOM中的節點。傳說中的虛擬DOM。

 

  

  再來一張圖:

  

  是不是一下子秒懂  沒懂再來一張

  

  

  

  Virtual Dom就先這樣,理解了就OK,下面我們了解一下Diff,老規矩先來一句概念:

  diff算法就是進行虛擬節點對比,並返回一個patch對象,用來存儲兩個節點不同的地方,最后用patch記錄的消息去局部更新Dom。

   換句人話

  diff的過程就是調用名為patch的函數,比較新舊節點,一邊比較一邊給真實的DOM打補丁

   

  廢話說了很多,上圖

  

  多說無益,再來一張圖

  

  這個Diff的過程不展開說了,有興趣的童鞋可以走起,如果還沒懂,再走起

  

  敲黑板時間到:

  基本上上面所講的能理解,差不多Vue Virtual Dom 和 Diff原理你也就懂了,當然更深的還需要自己去看,歡樂時光特別快,又到時候講拜拜

  

 

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM