Efficient caching of batched api queries.

[gjevardat]

Hello

I'am in the situation where I fetch some data using a paged approach
Each query return a set of timeseries (id, tag). We can have multiple tags per timeseries and the query return multiples ids (with mulitple tags).

To be explicit it looks like this:

const { data, error } = useSWR(
    `/api/getTSPage?runid=${runid}&pageIndex=${pageIndex}&pageSize=${pageSize}&tags=${tags.join('&tags=')}`, 
    fetcher
  );

it returns an array of timeseries

return {
    timeseries: data, 
    error: String(error) , 
    isLoading: isLoading
  };

My simple problem is that is I change the pageSize for instance, the data is not fetched from cache as the key of the query is different. It is very unfortunate as the data could be already there (not in all cases though). But if I issue the query with a subset of tags, then all data is really present soin that case it is really a waste to check for data.

So I browse the cache manually to check for the data or do I have to implement a custom cache/ key strategy ?

I exclude the simple solution to issue one query per timeseries, as it would be very inefficient on the backend side. But I see it would solve this caching issue.

So maybe an idea is to allow the fetch call to return a list of keys based on retrieved data