Diff算法—前端篇
當提起算法我們最熟悉的可能是在Linux中，如果需要比較兩個文件就可以使用比較的命令 Diff 通常在 Git 提交代碼的時候會使用這一算法原理提交代碼
而在前端當中的 Diff 算法，是指虛擬 DOM 變話的對比
傳統的 DOM 操作非常昂貴，數據的改變往往需要更新 DOM 樹上的多個節點，可謂牽一發動全身，而虛擬 DOM 和 Diff 算法的誕生解決了這一問題
Web 界面由 DOM 樹來構成，當其中某一部分發生變化時，其實就是對應的某個 DOM 節點發生了變化。在 React 中，構建 UI 界面的思路是由當前狀態決定界面。前后兩個狀態就對應兩套界面，然后由 React 來比較兩個界面的區別，本質是比較 DOM 節點差異當兩個節點不同時，應該如何處理。這分為兩種情況：節點類型不同 ，節點類型相同，但是屬性不同。了解它們就需要對 DOM 樹進行 Diff 算法分析
Diff算法的性能優勢就是在對比新舊兩個 DOM 的不同的時候只對比同一級別的 DOM 節點，一旦發現不同，后續 DOM 子節點將被刪掉不作對比，由於前端DOM樹的這一特性，算法對比的時間復雜度大大降低由標准的 O(n^3) 降低到 O（n）即一次對比后續節點不予考慮
（對比樣圖如下）
在對比發現不同后，將不同的子節點進行簡單的創建刪除操作，看似簡單粗暴的操作卻十分有用，對這樣的算法也讓我們對 DOM 結構有了更深的了解，有的時候使用 css 樣式隱藏 DOM 也會對整個頁面的性能會有一定的提升。