One common optimization is to strategically use shouldComponentUpdate to limit the number of components that render each time the state changes. In this case you could create a Month component which renders a single &lt;tr&gt; element. This component would then implement shouldComponentUpdate to check if the state used to render that month has changed. If not, shouldComponentUpdate returns false and the month does not re-render. This means that clicking on a Day should re-render two Months at most.<p>The same shouldComponentUpdate optimization could be added to both Calendar and Day, but in this case clicking a Day would always require the Calendar to re-render, and running through 365 shouldComponentUpdate functions (returning false from at least 363 of them) without first limiting by Month would not be ideal.<p>If the state is managed with ImmutableJS or a similar library, shouldComponentUpdate would only have to do a single reference equality check. Either way you should see a big improvement from any implementation that allows the individual Month components to skip rendering:<p><a href="http:&#x2F;&#x2F;facebook.github.io&#x2F;react&#x2F;docs&#x2F;advanced-performance.html" rel="nofollow">http:&#x2F;&#x2F;facebook.github.io&#x2F;react&#x2F;docs&#x2F;advanced-performance.ht...</a>