Remix.run Logo
ec109685 4 days ago

In almost all cases the back swipe in the spa resets you to the top of the page, navigating out of the app and back in doesn’t work, etc. It’s really hard to build a multi page spa that feels good.

zeroq 4 days ago | parent | next [-]

It's funny you've mentioned that.

It reminded me of the time when I joined Wikia (now Fandom) back in, I think it was 2006. One of the first things that landed on my desk was (I can't recall the context) deeplinking.

And I remember being completely flabergasted, as I came Flash/games background, and for us that problem was completely solved for at least 4 years at the time (asual swfaddress package). I felt kind of stupid having to introduce that concept to much more senior engineers that I was at the time.

dzhiurgis 4 days ago | parent | prev [-]

Never thought about scroll position (tho SPA I’ve built recently I think does it ok). How do you solve it?

throwawaylaptop 4 days ago | parent | next [-]

I'm a self taught PHP/jQuery/bootstrap guy with a small saas. I handle page scroll position by literally saving it into some session data cookie and when you go back I check where your scroll was and I fix it for you. I'm not a genius or skilled... But I cared so I did it.

PaulHoule 4 days ago | parent [-]

I’ve done it like that. It’s not a lot of code.

cyco130 4 days ago | parent | prev | next [-]

I write some of my thoughts on this sone years ago. The library described at the end is now fairly out of date but the ideas and suggestions are still good, I think.

https://dev.to/cyco130/how-to-get-client-side-navigation-rig...

fleebee 4 days ago | parent | prev [-]

Depends on what you're using for routing.

In Tanstack Router it's a boolean you set when creating the router. The documentation nicely lays out what's being done under the hood, and it's quite a bit.[1] I wouldn't try that at home.

In React Router you just chuck a <ScrollRestoration /> somewhere in your DOM.[2]

[1]: https://tanstack.com/router/v1/docs/framework/react/guide/sc...

[2]: https://reactrouter.com/6.30.1/components/scroll-restoration