Post

Figured out some bugs today. I now have scroll restoration working in TanStack.com's Router and Start for history restore & scrollToTop * window & element * SPA & SSR * hydration mismatch recovery * post-render dynamic content That's a lot of permutations lol

1 repost173 likes

Does this work in the same way as React Router, where scroll positions are stored in session storage, or is there another way to implement this? Not that I have anything against using session storage - just curious.

It was a big deal to me when I first discovered that scroll restoration doesn’t work out of the box in SPAs. Like “wow, this breaks a central part of the UX when navigating back” and “why haven’t I seen the UI/UX community complain more about this?”

It uses sessionStorage with history state keys, yes. I think SPAs traditionally didn’t care as much because apps had fewer expectations around saving your place. Less long form content maybe? Who knows. We did without a lot of things for a long time.

Yeah. I blame modals for a lot of this mess. My experience is that a big reason for having them in the first place was they were so much faster than a full page reload. Some designs even have full page modals with a close cross in the upper right corner. Personally I favor UIs that expand instead.