shouldComponentUpdate() を持っていない React.Component
shouldComponentUpdate()とは
- データの更新に対して差分のレンダリングを最小限に抑えるライフサイクル
- 手動で前回と今回のpropsを比較してレンダリングするか決める
- かなり面倒
React.PureComponent
- Shallow-Equal によってUpdateするか自動で決めてくれる。
Shallow-Equalとは
const object = {}, targetObject = {};
const isEqualed = Object.keys(object).some(key => {
return object[key] !== targetObject[key];
});
- おそらくshouldComponentUpdateを隠蔽している？
- すべてのComponentをPureComponentにすると、パフォーマンスが上がるわけではない。
- 必要のない箇所でもShallow-Equalを実行されてしまう。適切な箇所でやるべし。
ステートレスコンポーネントで PureComponent を使いたい
recompose を使いましょう
recompose とは
- reactにおけるユーティリティライブラリ。lodash的なやつ。
- 機能おおすぎ。
- すべてのコンポーネントをファンクショナルコンポーネントとして書ける
-
pure()というpureComponentライクな関数がある