[franky47]

The scroll feature to rewind/forward moves on a game, with syncing the state in the URL, is just awesome.

Do you mind sharing how it's done? I just published a library [1] that deals with syncing complex state in the URL, and I'd love to hear more about actual use-cases in the wild.

[1] https://github.com/47ng/next-usequerystate

[ThomasCM]

Thanks, I just like it when all state is in the URL and you can just bookmark it. Also using the browser back/forward button should work well thanks to that. I'll check out your library!

My code for that is rather simple. I'm using Next.js and the code looks something like this (a little simplified):

  const router = useRouter(); // get the router/location object
  const information = useFetch({ position: router.query.position }); // fetch information from the server
  
  function changeChessPosition(newPosition) { // called when position changes
      router.replace({ query: { postition: newPosition } }); // replaces the state in the URL
  }

In addition, I have some caching in place so that each position is only downloaded once and the change function looks a little more complicated in my case as there are multiple values that can be change for each page.