measureRef prevents component list item component memoization
vinczemarton opened this issue · 0 comments
Bug Report
Describe the Bug
I'm testing the library and with dynamic sizing I cannot get a memoized component to work. What I can see is that measureRef is always a new reference which prevents us from using memo() to its effect.
Maybe moving the measureRef function to the top component level and wrapping it in useCallback can help, but I'm having trouble making a working PR.
How to Reproduce
- Start from the Dynamic Size example.
- add some logging to keep track of renders
- add memoization to the accordion component
You can see that adding memoization does not change how many times a component is rendered. It is rerendered whenever something new is added/removed from the list.
It seems to be the measureRef reference as when I don't provide the measureRef function to the component it seems to work fine.
CodeSandbox Link
Show me the bug on CodeSandbox.
Expected Behavior
Only the newly inserted elements should rerender.
Screenshots
Your Environment
- Device: [MacBook Pro]
- OS: [macOS]
- Browser: [Chrome]
- Version: [latest]