React Suspense

Reactで「componentをrenderできない」= suspended という状態を取り扱えるようにする機能

Web APIからデータをフェッチしている間のローディングなど

Suspense component の子のうちいずれかが suspended であれば fallback に指定した component を render する

code:suspense.js

const App: React.VFC = () => {

return (<PageLayout>

</Suspense>

</PageLayout>);

};

React v18 の SSR streaming ではこの仕組みをフル活用する

参考