react-dom の preload はファイルを先にダウンロードするだけで、preinit は実行や適用まで進めます。head に入る要素、precedence の順番、クリックで読み込みを始める効果、サーバーでの出力を確かめまし ...

lazyで包んだコンポーネントは、最初に表示するときまでコードを読み込みません。Suspenseで読み込み中の表示を出す書き方、default以外のexportの読み込み方、先に読み込みを始める方法、読み込みに失敗したときの動きを確か ...

React 19 のコンポーネントを、Vitest と React Testing Library でテストする手順です。後片づけの登録、findBy での待ち方、Suspense を使うコンポーネントを await act で描画す ...

React 19 の use と Suspense は「待つ表示」、useActionState は「送信中の状態」を受け持ちますが、データのキャッシュは受け持ちません。自前のキャッシュと TanStack Query で同じ画面を作 ...

タブの切り替えで表示中の画面がSuspenseの「読み込み中…」に置き換わるのは、startTransitionで防げます。isPendingで切り替え中を示す方法、入れ子のSuspenseで待つ範囲を決める方法、keyで読み込み中に ...

React 19のuseなら、Promiseとコンテキストを描画中に読めます。待ち時間はSuspense、失敗はError Boundaryに任せられ、コンテキストはifのあとでも読めます。キャッシュしないPromiseを渡すとどうな ...