React Suspenseで不要な描画処理をなくす

function ProfileDetails() { const user = resource.user.read(); // throw promise here return <h1>{user.name}</h1>; } この仕様自体、それだけで記事になるほど面白いです。（ここでは割愛します。） React Freeze React Freezeは、そんなSuspenseを利用したライブラリです。 元々React側は、データ取得の際に使うことが主なユースケースと言っていたのに対して、このライブラリの目的は、ある瞬間にユーザーに表示されていないアプリの部分について、不要な再レンダリングを避けることとなっています。 どうやって実現しているのでしょうか？ 実は、ライブラリの実装もシンプルで興味深いです。 // ref: https://github.com/software-mansi

[efcl]

React Freezeの動作の仕組みについて。

[amagitakayosi]

なるほど、面白〜

[yarumato]

“Suspenseは、データの読み出しが準備できているかどうかをReactに伝える仕組みである。React Freezeライブラリは、アンマウントされない性質で、スクロール位置、input、ロード済み画像などを保持したまま再描画を抑制可能”

[kako-jun]

"データの読み出しが準備できているかどうか" ←‎useQueryが自動で何度もリトライして、全部いい感じにしてくれるんだと思ってた

[Pasta-K]

なるほどね

[kvx]

はー