📘

React メモ化って何?

2022/10/26に公開

起きた問題

  • hooksを勉強していると突如出てくる「memo化」
  • その割には説明もなく、「はいここで、memo化します」みたいな感じで困った。
  • そもそもmemo化ってなんですか?というお話

React what is memo? <- 実際これでググった

If your component renders the same result given the same props,
you can wrap it in a call to React.memo for a performance boost in some cases
by memoizing the result. 
This means that React will skip rendering the component,
and reuse the last rendered result.
  • 同じpropsを受け取った時、
  • React.memoで実装されたコンポーネントは内容をmemoizingすることによってパフォーマンスを上げることができる
  • これはつまり、前に描画したコンポーネントの内容を再利用することによって、再描画をしないようにできる

Memoization 参考

  • メモライゼーションではなく、メモイゼーション。
In computing, memoization or memoisation is an optimization technique 
used primarily to speed up computer programs 
by storing the results of expensive function calls 
and returning the cached result when the same inputs occur again.
  • メモイゼーションはコンピュータプログラムの速度を改善するもの
  • 同じ入力があった場合にキャッシュに保存した内容を返す

軽くまとめ

  • メモ化というのはメモイゼーションというIT用語から来ていそうだった(おそらく)
  • 関数に対して同じ値が入力された時に、再計算をせずキャッシュを返却するもの
  • この機能によってコンピュータの負担を減らすことができる

感想

メモイゼーションというのが初耳でした。
メモ化というのは単なる記録くらいに思っていたのですが、改めて勉強すると深かったです。

Discussion