scroll position restoration

[spacepolice10]

Hi,

It is said on the main page of TanStack Query and in docs that you have to do nothing with the scrolling position. The same thing for Tanstack Virtual. I have tried to use both in combo to create infinite list of content. Scroll position has been never restored correctly. If I scroll for about 100 elements, it might put me to 98 (that's ok more or less). But it also might throw me to 124 (that's not ok at all). If I scroll for about 400 elements, open one of them and then get back, this library can throw me to, let's say, element number 86. I came here because there are no examples or some solutions in the official docs. It says everything just works. But it's not and I hope someone could give me some kind of advice, please.

I use the latest versions of Tanstack Virtual and Tanstack Query.
I use measureElement to render dynamic items.

Thanks in advance

[TkDodo]

scroll restoration is a feature of the browser. It defaults to auto, which means:

The location on the page to which the user has scrolled will be restored.

The problem with many client rendered applications is that once you go back, the data you viewed is "lost". You'll see a brief loading spinner, followed by your data. That is enough for the browser to not be able to scroll to the previous scroll position.

So the only thing that react-query does here is to instantly render data from the cache, which should be enough to make scroll restoration work.

[spacepolice10]

I see. I understand the way it work but I didn't even implement interface placeholders like spinners yet. Cached data appear instantaneously (visually) but it seems like browser is still restore scroll position earlier than DOM tree rendered. Couldn't find any ability to delay that process. Probably I need to manually detect position and pass it as initialOffset in Tanstack virtual