[BUG] Scroll position is not maintained while scrolling fast (Chrome, iOS)

[Pardoniano]

Describe the bug
At GroupedVirtuoso scroll position is not maintained while scrolling fast and returning to last position at mobile resolution.

Reproduction
https://virtuoso.dev/scroll-to-group/

To Reproduce
Steps to reproduce the behavior:

1. Scroll to any session in the middle group (I suggest starting from the letter m, as seen in the video);
2. Scroll up;
3. Scroll down
4. See the scroll behavior;

Expected behavior
A clear and smooth transitions between Groups

Screenshots
https://user-images.githubusercontent.com/77992549/179848898-2ae91587-1fa9-459a-a9f7-54f37c4f011e.mov

Desktop (please complete the following information):
Versions:

• IOs: 15.5
• Chrome: 103.0.5060.63

[petyosi]

Question - can you reproduce the problem on Safari? To me, it looks like something specific to Chrome/iOS.

[Pardoniano]

Doesn't seems to be happening on Android - Chrome and Safari - IOS.

[jddalessandro]

I'm also having some issues in Chrome on iOS that are somewhat related. Inverse scroll is extremely jumpy (scroll position shifts drastically). This is exaggerated with image elements. The issue does not happen in Safari on iOS

Scroll speed does not seem to make a difference.

[jddalessandro]

I'm also having some issues in Chrome on iOS that are somewhat related. Inverse scroll is extremely jumpy (scroll position shifts drastically). This is exaggerated with image elements. The issue does not happen in Safari on iOS

Scroll speed does not seem to make a difference.

I reverted to 2.9.2 and removed increaseViewPortBy props that I was passing in and noticed no more jumping in scroll position.

[petyosi]

@jddalessandro @Pardoniano - a fix was discovered in #788 . Can you check if this helps?

[ignatevdev]

I'm also experiencing constant jumps and flickers on mobile browsers only. In my use case I have a chat with various types of messages, including images, but every message is initially rendered to its' proper size and is not resized afterwards. Also the flicker happens only on the initial scroll top, when new messages are loaded and rendered for the first time. After all the messages are loaded and rendered no more flickering occurs on any scroll direction.

I've tried to reproduce this in a sandbox, but the problem there seems a bit different from what I have in my project and also happens on desktop.

I'd be glad to provide any additional info in order to fix this.

Sandbox:
https://codesandbox.io/s/sandpack-project-forked-fvp3iv

[petyosi]

@ignatevdev Your example flickers due to margins. Read the readme and the docs - troubleshooting.