純関数
純関数とは『計算だけを行い、他には何もしない関数のこと』で次の特徴がある。
- 呼び出される前に存在していたオブジェクトや変数を変更しない
- 同じ入力を与えると、純関数は常に同じ結果を返す
純関数は数学で言うところの f(x) = x
と同じで入力が同じであれば常に同じ出力となるものと言える。
コンポーネントを常に厳密に純関数として書くことで、コードが大きくなるにつれて起きがちな、あらゆる種類の不可解なバグ、予測不可能な挙動を回避することができるようになるらしい。
React はコンポーネントが純関数であると仮定しているため、入力が同じであれば常に同じ JSX を返す必要がある。
なぜ純関数が重要なのか?
- 入力値が同じなら同じ結果を返すので、一つのコンポーネントが多数のユーザリクエストを処理できる
- 入力値が変化しない場合、レンダーをスキップできるためパフォーマンスを向上できる
- 深いコンポーネントツリーのレンダーと途中に入力値の変化を検知したら、そのタイミングで新しいレンダーを始めることができる
レンダー更新とコンポーネントを使う側へのメリットが多いと理解🤔
当該コンポーネントを利用する側のメリットとしては、入力値のみを気にしておけば、使用する際に変な影響を受けないということなのかと思った。