Post

@tannerlinsley.com @phry.dev any tips on how to skip suspending when I update search params in Tanstack Router which re-triggers `preloadQuery` in the `loader` that returns `queryRef` that is then read with `useReadQuery`? Wrapping `navigate` with `startTransition` doesn't seem to help 🤔

Lenz Weber-Tronic

@phry.dev

Phew. I would have hoped for a `navigate` transition as you did... :/ I'm pinging Jerel on the side, maybe he has an idea.

9/12/24, 3:08 pm0 reposts1 like

Lenz Weber-Tronic

@phry.dev

9 Dec 2024

Did you return `queryRef` or `queryRef.toPromise()` from the loader? Doing the latter might help.

Teemu Taskula

@teemutaskula.com

9 Dec 2024

Thanks for the tip 👍 I'll come back to you tomorrow with the results when I'm back at work 😁

Dominik 🔮

@tkdodo.eu

9 Dec 2024

bottom line is that transitions around navigate "work", but are short-circuited by useSyncExternalStore used by the router :/. It's a trade-off. FWIW, useDeferredValue on the QueryKey is what works for react-query.

Teemu Taskula

@teemutaskula.com

9 Dec 2024

@tkdodo.eu @manuelschiller.bsky.social I would like to better understand what "but are short-circuited by useSyncExternalStore used by the router" actually means in practice? Does it mean that trying to stop router driven suspension with transitions is not a viable solution in Tanstack Router?

Teemu Taskula

@teemutaskula.com

9 Dec 2024

Thanks for the input @tkdodo.eu 👍 We already have a custom version of `useSuspenseQuery` that handles the re-suspension issue but @phry.dev is it possible to do something similar with `useReadQuery`? Or what would be the best pattern to use Suspense with loaders that are driven by url params?