React フック
https://ja.reactjs.org/docs/hooks-intro.html
React (JS) 16.8 から追加された新機能
from: 基礎から学ぶ React / React Hooks
関数コンポーネントに様々な機能を追加できる
useState : 最も基本的なフック。 状態 (State) 管理のためのもの
useEffect : 副作用 (UI 構築以外の処理) を実行、制御するために使用する
関数の実行タイミングをコンポーネントのマウント後やアンマウント後、更新後まで遅らせる
パフォーマンスチューニングのためのフック
再レンダリングをスキップさせる
React.memo : コンポーネントのレンダリング結果をメモ化
useCallback : 関数自体をメモ化するフック
React.memo では、props でコールバック関数が渡された場合は再レンダリングされてしまう
コールバック関数の中身が同じでも別オブジェクトであるため
このフックを使うことで、同一のコールバック関数が使用されるようにする
useMemo : 関数の結果を保持するためのフック
レンダリングごとに行われる不要な再計算をスキップできる
useRef : 要素の参照を行うためのフック
コンポーネント内で変数に値を保持できる
値が更新されてもコンポーネントの再レンダリングは行われない
主に DOM へのアクセスに利用される
useContext : Context 機能をよりシンプルに使えるフック
See : React のコンテクスト
カスタムフック
関数名が use から始まる独自のフックで、他のフックを呼び出せる
UI とロジックを切り離すのに使える