TanStack-Query
queryKey
TanStack Query の queryKey の管理方法が、インライン配列、定数オブジェクト、クエリキーファクトリーを経て v5 の queryOptions までどう進化したかを整理する。記述規則、DataTag による型推論、無効化のパターンを実務の観点で扱う。
queryKey比較の仕組み
TanStack Query がレンダリングのたびに新しく作られる queryKey 配列を同じキーと判定する仕組みを整理する。hashKey のシリアライズがキー順、undefined、Map などの値をどう変えるか、フィルターがキーの構造をどう比較するかまで扱う。
ErrorBoundary の配置
React Router と TanStack Query を使う画面で、ErrorBoundary をいくつ、どこに置くかを決める基準をインストール済みのソースで確かめる。ルート、画面、領域ごとに受けるエラーと戻し方、fallback をひとつにそろえる方法、再試行の条件まで扱う。
再試行ボタンが効かない理由
react-error-boundary の再試行ボタンを押しても同じ fallback がまた出る三つの場合をソースで確かめる。クエリのエラーは QueryErrorResetBoundary、レンダーエラーは queryFn の検査、React.lazy のチャンク失敗は再読み込みで解く。
エラーの伝播
同じエラーを七か所から投げてみると、ErrorBoundary に届くのは四つだけだ。コンパイル時、レンダーとライフサイクル、サーバーデータ、ページ遷移、外部ライブラリ、イベントと非同期がそれぞれどこへ伝播するのかを、公式ドキュメントとインストール済みのソースで確認する。