#How to prevent loader from over fetching?

1 messages · Page 1 of 1 (latest)

tender fossil
#

I have a dashboard page with a loader that has about 8-10 different API endpoints I need to hit in order to get everything needed to render this page. I Promise.all the requests and the page loads in about 2-3s, not great but not terrible for how dynamic all of the data is. My issue is that when a user adds a comment to this page, it forces the entire loader to run again and i have to wait 2-3s for that comment to show up. Meanwhile the query to get the comment is around 200ms. Do i have any way of invalidating just that one specific query instead of all 8-10 API requests in the loader? Ideally don't want to use optimistic rendering since the query to fetch new comments is so fast

hot lava
#

you can use the shouldRevalidate function on the route to prevent revalidating the loader, but it's an all or nothing, you can't avoid fetching part of the loader

if you want to avoid fetching only part of the data you will have to use a server-side cache

tender fossil
#

Ok thats what i thought. What are my options if i want to load the data at a component level and then just revalidate that data after submitting an action ?

hot lava
#

you can use the useFetcher hook, but the SSR will have no data

#

if you want to have SSR with data you can do a mix, use the loader for the initial data, shouldRevalidate to avoid fetching again, and then useFetcher to load new data