petyosi / react-virtuoso

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

[BUG] `InitialTopMostItemIndex` causes variable height elements to blink/jump when scrolling up. #1096

Closed KarsonJo closed 4 weeks ago

KarsonJo commented 3 months ago

Describe the bug When InitialTopMostItemIndex is set to a value greater than 0, all previous elements outside the viewport (of variable height) have a certain probability of causing flickering / jumping when first rendered by scrolling up. The problem only occurs when the following conditions are met:

  1. The elements are before the element set by InitialTopMostItemIndex.
  2. The elements are of variable height.
  3. The elements are rendered for the first time.

Reproduction Stackblitz

To Reproduce Steps to reproduce the behavior:

  1. Scroll up to previous elements.
  2. See error.

Expected behavior No flickering / jumping when scrolling up.

Desktop

Additional context This bug first appeared in version 4.7.7. Earlier versions had no problems.

tazaryoot commented 1 month ago

i have the same issue

petyosi commented 4 weeks ago

v4.9.0 introduced a flag to deal with this: https://stackblitz.com/edit/vitejs-vite-sgzjbj?file=package.json,src%2FApp.jsx%3AL21. Keep in mind that you need to take care of #1049 .