ざっくりReact Fiberまとめ

Fiberとは ● Stackに変わる新しいReconciliation（リコンシリエーション）用の構造 ● React v17よりデフォルトでFiberを使用した非同期のRenderingに変更 →Fiberを使用した非同期Renderingになることで、 　ユーザのアクション（Inputへの入力など）を待たせないようになる

Reconsiliationとは ● Virtual DOMの差分取得アルゴリズム ● 差分取得結果をもとにHost（DOM等）に反映 ※HostとはブラウザであればDOM、 　ネイティブであればReactNativeのビュー

StackとFiberの違い Stack(既存) Rootから順番に全て の子Componentを処 理後、renderingする 為、処理中にユーザ からアクセスがあっ た場合に対応できな い Fiber(v17〜) class App extends React.Component { render(){ return(

まとめ ● renderingする裏側の構造の変更の為、実際に使用する側としては 意識する必要はあまりない ● 非同期Renderingにより、ユーザを待たせないようになる

Appendix

Links ● https://github.com/acdlite/react-fiber-architecture ● http://blog.koba04.com/post/2017/04/25/a-state-of-react-fiber/ ● https://qiita.com/seya/items/a655adb340af3b6690b5 ● https://postd.cc/react-fiber-architecture/