react-spectrum
react-spectrum copied to clipboard
I18nProvider re-renders unnecessarily due to a new dict value being re-created every time
Provide a general summary of the issue here
Some hooks like useCalendarGrid use the useLocale hook to fetch locale information. However if the I18nProvider is rendered (eg. as part of a parent update somewhere in the tree) even if locale stays the same it re-creates a new dictionary object forcing all child hooks to re-render (even if their parent components don't have to).
๐ค Expected Behavior?
The hook should memo the dict value to avoid causing renders down the tree or I18nContext should be exported to allow for custom adjustments to this behavior.
๐ฏ Current Behavior
Only the provider is exported which causes this issue. It's not possible to access the context itself so it's not possible to resolve this problem in userland.
๐ Possible Solution
No response
๐ฆ Context
No response
๐ฅ๏ธ Steps to Reproduce
- Create a calendar structure as per examples wrapping it in
I18nProvidersomewhere close to the top of the app tree - Memo the calendar component so it doesn't update when parents do
- Force a render to the app causing a re-render to the
I18nProvider- observe the dict now changes reference causing re-renders everywhere its used (including inside the calendar - even if we don't change anything in it)
Version
3.32.1
What browsers are you seeing the problem on?
Firefox, Chrome, Safari, Microsoft Edge
If other, please specify.
No response
What operating system are you using?
macOS
๐งข Your Company/Team
No response
๐ท Tracking Issue
No response