Prevent server calls on loader based on client cache
I'm setting up a project with Remix and Tanstack Query. The loader is providing initial value for my view in the initial load + navigations. But between navigations, I might already have the result of that query, cached and fresh on the client and I would like to not trigger a query/fetch on the server related to the fresh queries. But since the client loader always need to call the server loader in order to get the data (I'm streaming with defer), I need a way to inform the server to skip some fetches/queries before I call it.
Any ideas how to achieve that?
My primary think was to set a cookie on client before call the server loader with info of the queries and their status.
The only API for this I could find was this, but is not 100% what I'm looking for.
5 Replies
equal-jadeOP•16mo ago
cc @TkDodo 🔮 I haven't found any articles related to this topic (integrating Remix with React Query)
helpful-purple•16mo ago
can you conditionally call the server loader ?
equal-jadeOP•16mo ago
Yes! Client loaders allow you to do that
https://remix.run/docs/en/main/route/client-loader
Remix
clientLoader | Remix
helpful-purple•16mo ago
okay then just don't call the serverLoader if you already have cached data in the client ...
equal-jadeOP•16mo ago
one loader can return multiple queries, I want a API to tell the loader which queries it should fetch again. Sorry I didn't make it clear earlier