Facebook正在以流行的JavaScript框架React為基礎開發一個全新的架構。這個名為React Fiber的全新設計改變了檢測變更的方法和時機，借此可改進瀏覽器端和其他渲染設備的響應速度。
這一全新架構最初已于2016年7月公開發布，其中蘊含著過去多年來Facebook不斷改進的工作成果。該架構可向后兼容，徹底重寫了React的協調（Reconciliation）算法。該過程可用于確定出現變更的具體時間，并將變更傳遞給渲染器。
實際上該團隊在單線程JavaScript引擎的基礎上構建了一種可劃分優先級的協作式任務調度器。在最初的協調算法（現已更名為Stack Reconciler）中，Virtual DOM diff會一次性處理整個組件樹：
重點在于，Stack Reconciler始終會一次性地同步處理整個組件樹。Stack Reconciler無法暫停，因此如果更新較為深入并且可用CPU時間有限，這種做法并非最優化的。
與之相對的Fiber Reconciler則有著截然不同的目標：
能夠將可中斷的任務拆分成塊。 能夠對進程中的工作劃分優先級、重新設定基址（Rebase）、恢復。 能夠在父子之間來回反復，借此為React的Layout提供支持。 能夠通過render()返回多個元素。 為錯誤邊界提供了更好的支持。簡單來說，此時不在需要等待變更傳播到整個組件樹，React Fiber可以知道如何時不時暫停一下，檢查是否有其他更重要的更新。這種調度能力主要基于requestIdleCallback的使用，而這是一種W3C候選推薦標準。
在React Conf 2017大會上，Lin Clark通過名為React Fiber簡介的演講循序漸進介紹了新協調器的獨到之處。
大部分情況下，開發者無需擔心代碼的適配問題，但也有少量應用依賴以特定順序進行的生命周期鉤子（Lifecycle hook）。由于順序已經無法保證，因此可能會遇到一些問題。
“為確保這一特性不會影響應用”，Clark稱：“Fiber團隊正在制定更為平緩的升級路徑”。
Dan Abramov寫到，React團隊認為大部分React應用不會因為第16版而遇到問題：
React 16（正在開發中）是一次革新，但也使用了相同的公開API。對于Facebook所使用的超過30,000個（！）組件，其中只有少量需要改動，并且這少數組件主要被一些已經不再支持或沒有正式記錄在案的行為所使用。因此可以說完全可以保證99.9%的兼容性。這也讓我們確信React 16基本上也可以直接適用于你的代碼。
Fiber將在React 16中首次登場，第16版不僅包含新的協調引擎，而且提供了可串聯使用的全新渲染器（例如ReactDOM、React Native）。同時isfiberreadyyet.com提供了測試套件的最新結果。截至撰寫本文時，已順利通過了92.2%的測試。
閱讀英文原文：React Fiber: A Closer Look at the New Engine of React
京公網安備 11010502049343號