You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Implementing shouldComponentUpdate in Month is more difficult as the modifiers may have different values which are harder to compare. Anyway, after the optimization above we can see less wasted time on re-rendering components.
This is more visible when rendering multiple months, e.g. with numberOfMonths={24} and selecting one day in the calendar:
Before we see a wasted re-rendering of 874 out of 875 days, and for the other components like Caption and Weekdays:
After no wasted rendering for days and other components:
Optimization is less visible when selecting one day in a one-month calendar, e.g. before:
and after (no wasted time re-rendering the calendar):
Analyzing #374 I've found we can optimize the re-rending of the components by using
shouldComponentUpdate
orPureComponent
.Caption
component – should be usingshouldComponentUpdate
to avoid useless re-rendering. Should update only iflocale
anddate
's year/month change.NavBar
component – can extendPureComponent
Weekday
component – can extendPureComponent
Weekdays
component – can extendPureComponent
Day
component – should be usingshouldComponentUpdate
to avoid useless re-rendering. Should update only if the day's modifiers change.The
Month
component uses its child as function to renderDay
, this is a weird pattern and makes optimization harder:renderDayInMonth
andrenderDay
method fromDayPicker
toMonth
Month
component should be usingshouldComponentUpdate
to avoid useless re-rendering. Should update if modifiers change.The text was updated successfully, but these errors were encountered: