注意書き (2019/12/16 追記) こちらのコメント を受けて追記します。 コメントにあるように、React Developer Tools が示している「レンダリング」とは、関数コンポーネントの本体（あるいはクラスコンポーネントの render()）が呼ばれること、そして結果として仮想DOMの差分検出処理（リコンシリエーション）が走ることを指しています。よって、緑の枠がなんども表示されるからと言って、そこにかかる処理のコストは多くの場合高くないので、そこを減らすためのパフォーマンスチューニングがコストに見合うことはあまりないかと思いますので、この記事を参考にする場合は注意してください。 ただこの記事で紹介した react-redux の useSelector に shallowEqual を渡す手法や、コメントにある React.memo を使用すること自体は最適化の方法として正
