search

petyosi / react-virtuoso

The most powerful virtual list component for React
https://virtuoso.dev
MIT License
5.13k stars 299 forks source link

[BUG] Flickering of Dynamic Elements When Scrolling Up #1062

Closed shunshimono closed 4 months ago

shunshimono commented 4 months ago

Describe the bug

There is an issue where elements within a list that contains dynamic elements flicker when slowly scrolling up. This issue consistently reproduces under certain scrolling actions.

To Reproduce

  1. Access the provided CodeSandbox link at https://codesandbox.io/p/devbox/virtuoso-p6xztn?file=%2Fsrc%2FApp.tsx.
  2. Scroll up slowly within the list.

Expected behavior When scrolling through the list, it is expected that elements are displayed smoothly without any flickering or blinking.

Screenshots Screenshots of the issue can be viewed here

https://github.com/petyosi/react-virtuoso/assets/68690488/ef4a1a16-9280-4dfc-a7a5-302306e9f127

Desktop (please complete the following information):

If anyone is aware of this issue and has any solutions or workarounds, please share them. Additionally, if there are any library updates or configuration changes that could potentially improve the situation, information on that would also be greatly appreciated.

petyosi commented 4 months ago

What you see is the readjustment of the scroll location when new items with a height different than the previous are rendered. I have not discovered a way to avoid this.