is it possible to use remix-client-cache with defer (and client loader)?
this is what i tried so far: tried using useSwrData and Await
but not sure if that actually caches stuff
#defer with remix-client-cache
lusty python
worthy wharf
Defer does nothing in clientLoader. It's already running in the browser, so promises don't need to be serialized.
I also don't see where you're using remix-client-cache there
lusty python
useSwrData is a remix-client-cache hook
if i use it like this i get:
Error: Failed to execute 'put' on 'IDBObjectStore': #<Promise> could not be cloned.
at http://localhost:5173/node_modules/.vite/deps/idb-keyval.js?v=ec184260:28:11
at http://localhost:5173/node_modules/.vite/deps/idb-keyval.js?v=ec184260:14:49
so its not possible to use defer with client cache?
worthy wharf
Yeah, I don't think defer works with it. That error says its trying to put a promise into IndexedDB, which is a no-go
What you need to do is await the deferred data in your clientLoader before putting it into your cache
If you think about it, the two tools - defer and client cache - are a bit at odds with each other.
Defer is good if you want the initial page load to be fast, but some data can come in later. Blog comments are a great example.
Client Cache is good if you're okay with the very first load being slow, but every other load being fast. And if you're okay with the data being a little stale. A searchable database with hundreds of records is a good example.
lusty python
so the useSwrData hook doesn't use stale data?
when i log a refresh the very first 5 logs are already resolved and the nested promises already have data then it turns into a promise
worthy wharf
useSwrData literally has Stale in its name. Kind of.
lusty python
isn't that caching?
worthy wharf
Yeah. You said that useSwrData comes from remix-client-cache
lusty python
so this is best of both, caching and fast initial load 😄
worthy wharf
I don't understand. Isn't it not working for you?