onOutsideRange constantly and needlessly recomputes thousands of time

It looks like onOutsideRange() is recomputed for EVERY SINGLE DATE every single time the datepicker is interacted with, be it clicking, or even hovering over dates.

My test function:

isOutsideRange(day) {
  console.log(counter++); // counter is a global variable

  return false;
}

The result:

When opening the datepicker for the first time (clicking an input), Chrome debugger logs up to 2519:

When the mouse enters or leaves any calendar date, Chrome debugger logs an additional 560 (18 months worth of days?) calls. Finally, subsequent closing / opening of the datepicker logs an additional 160 calls (560 * 3, significant?)

If the isOutsideRange() function is anything more than trivial, this results in a very noticeable performance slowdown.

Ideally, the result of isOutsideRange() should be cached for each day, or should only be calculated for localized days, e.g. for all the dates currently visible ± 7 days (to account for outside days).

[majapw]

v11.0.0 (I swear the last breaking release for a while) rearchitects modifiers so now there’s about the same overhead at mount, but then calendar interactions only updates the relevant CalendarDay objects instead of all of them.

You can see more details in #450, but in the meantime, I’m going to close this issue of being “generally slow”. There are still some improvements to be made, notably during the month transition phase, but I think this new architecture opens up a lot of doors. 😃

[sontek]

I’m with @timhwang21 on this one, I don’t see any reason to modify the values on hover and the performance improvements would be amazing if we could stop re-calculating all the time 😃

Currently react-dates is unusable on iOS and it doesn’t have hover so this would probably solve that issue pretty well without hurting anything