React 開發者一定要知道的底層機制 — React Fi…

Highlights

• React Hooks 得以實現也是因為 React 使用 fiber架構重構喔

• • fiber 可以將頁面渲染的任務切分成 chunks • 不同的任務可以經過 prioritize 區分優先級 • 任務可以暫停，之後再繼續執行（這也是將任務分優先級的目的，當做到一半出現更高優先級的任務的時候，會希望可以先暫停目前工作的執行，等處理完高優先及任務後再回來繼續執行） • 可以重複使用之前的 work，也可以將不需要的 work 丟棄掉

• 談到 React 怎麼更新我們的畫面，大家應該都知道 React 透過 Virtual DOM 還有 Diff 演算法算出畫面中實際需要更新的部分，比對更新前後 virtual DOM 的差異之後，再去更動真實的 DOM，有效減少渲染的次數 ，而這個 Diff 的過程也被稱作 reconciliation。