NOTE 105 / 2022年

値の届く範囲を、Provider からたどる

Context の値がどこから届き、どこで再描画を起こすのかを整理します。

2022年2月27日読了目安約2分

useContext は、親から子へ値を渡す経路を短くする仕組みです。Provider の値が変わると、その値を使っているコンポーネントは再描画の対象になります。どのコンポーネントが値に依存しているかを意識すると、更新の範囲を読みやすくなります。

Context は何でも入れる箱ではありません。画面全体で共有する設定や、複数の階層で必要な状態に向いています。頻繁に変わる値を入れる場合は、分割や memo 化も合わせて検討します。

押さえたい点

外部サイトが開きます。内容は各サイトの管理下にあります。