大家好,我卡頌。
2022年3月29號,React18
正式版釋出。
從v16
開始,React
團隊就在普及併發
的概念。在v18
的迭代過程中(alpha、Beta、RC),也一直在科普併發特性
,所以正式版釋出時,已經沒有什麼新鮮特性。
本文主要講解v18
釋出日誌中透露的一些未來發展趨勢。
歡迎加入人類高質量前端框架群,帶飛
開發者可能並不會接觸到併發特性
React
對增加API
是很慎重的。從13年誕生至今,觸發更新的方式都是this.setState
。
而引入併發
概念後,光是與併發
相關的API
就有好幾個,比如:
- useTransition
- useDeferredValue
甚至出現了為併發
兜底的API
(即併發情況下,不使用這些API可能會出bug),比如:
- useSyncExternalStore
- useInsertionEffect
一下多出這麼多API
,還不是像useState
這種不使用不行的API
,況且,併發
這一特性對於多數前端開發者都有些陌生。
你可以代入自己的業務想想,讓開發者上手使用併發特性
有多難。
所以,在未來用v18
開發的應用,開發者可能並不會接觸到併發特性。這些特性更可能是由各種庫封裝好的。
比如:startTransition
可以讓使用者在不同檢視間切換的同時,不阻塞使用者輸入。
這一API
很可能會由各種Router
實現,再作為一個配置項開放給開發者。
萬物皆可Suspense
對於React
來說,有兩類瓶頸需要解決:
- CPU的瓶頸,如大計算量的操作導致頁面卡頓
- IO的瓶頸,如請求服務端資料時的等待時間
其中CPU的瓶頸
通過併發特性
的優先順序中斷機制解決。
IO的瓶頸
則交給Suspense
解決。
所以,未來一切與IO
相關的操作,都會收斂到Suspense
這一解決方案內。
從最初的React.lazy
到如今仍在開發中的Server Components
,最終萬物皆可Suspense
。
這其中有些邏輯是很複雜的,比如:
- Server Components
- 新的服務端渲染方案
所以,這些操作不大可能是直接面向開發者的。
這又回到了上一條,這些操作會交由各種庫實現。如果複雜度更高,則會交由基於React
封裝的框架實現,比如Next.js
、Remix
。
這也是為什麼React團隊
核心人物Sebastian
會加入Next.js
。
可以說,React
未來的定位是:一個前端底層作業系統,足夠複雜,一般開發者慎用。
而開發者使用的是基於該作業系統實現的各種上層應用。
總結
如果說v16
之前各種React Like
庫還能靠體積、效能優勢分走React
部分蛋糕,那未來兩者走的完全是兩條賽道,因為兩者的生態不再相容。
未來不再會有React全家桶
的概念,桶裡的各個部件最終會淪為更大的框架中的一個小模組。
當前你們業務裡是直接使用React
呢,還是使用各種框架(比如Next.js
)?