useCallbackとは？
以前に紹介したuseMemoと同じ感じで、関数をメモ化します。
つまり、初回時のレンダリングまたは、依存する値が変わらない限りは、前回と同じ関数インスタンスを再利用するようになるので、パフォーマンスが向上します。
const onClick = useCallback(() => { Router.push(`/rooms/${id}`) }, [id])
ちなみに、useMemoやuseEffectと同じように、第二引数で依存する値を設定します。
てな感じで本日も以上となります。
参考
- https://ja.reactjs.org/docs/hooks-reference.html
- https://tyotto-good.com/blog/usecallback
- https://qiita.com/seira/items/8a170cc950241a8fd
- https://blog.uhy.ooo/entry/2021-02-23/usecallback-custom-hooks/
