毎回関数を作ってpropsに設定する問題の修正 · Webフロントエンド パフォーマンス改善ハンドブック

毎回関数を作ってpropsに設定する問題の修正 Reactのよくある問題として、propsに関数を渡すパターンで...概要を表示 毎回関数を作ってpropsに設定する問題の修正 Reactのよくある問題として、propsに関数を渡すパターンで毎回関数を作って渡してしまうが知られています。 毎回新しい関数を作ってしまうと、同じ異なる値（props）となるため無駄にコンポーネントが更新されてしまいます。 why-did-you-updateでもこの問題を検知できます。 この問題は、関数同士の比較は常にtrueとしてしまうshouldComponentUpdateを実装するか、一度作った関数をちゃんと使いまわす（constructorで作成やpublic fieldを使う）ことで解決できます。 また、ESLintやTSLintといったLintツールでも検知できます。 tslint: jsx-no-lambda eslint: jsx-no-bind 参考 React.jsのrenderの戻り値の中で.bindで新しい関数を

• performance