【React】コンポーネントのmemo化

再レンダリングのタイミングと対象

1. stateが更新されたコンポーネント
2. propsに変更のあったコンポーネント
3. 再レンダリングされたコンポーネントの配下コンポーネント
   ※organismsが再レンダリングされるとmolecules・atomsも再レンダリングされる。

問題

今回取り上げる問題は3つ目のタイミング。
親のstateが更新された際に、子コンポーネントの再レンダリングを回避する。
そのために使うのがmemo。

memo( ここに子コンポーネントの関数を入れる )
// 例
import {memo} from "react"
const test = memo( ({text}) => { 
  return <h1>{text}</h1>
 } )

memoを付けたコンポーネントはpropsに変化が無い限り再描画されない。
※上記の例だとtextに変化がない限り再レンダリングは起きない。