Caching results by id as well as the original list

[hornta]

Before RTKQ I was used to manually always store an "index by id" object along side the original item list for quick access instead of having to iterate through the list.

With RTKQ this doesn't feel as trivial as before because the majority of examples doesn't perform this typeof of mapping in the transformResponse function.

Would it make sense to save this mapping in the cached endpoint like this? Is there a better way? What I want is to make this mapping once for the cached data.

... // inside createApi getItems: builder.query<{ items: Item[], itemById: Record<Item["id"], Item> }, void>({ query: () => `/v1/items`, transformResponse: (response: Items[]) => { return { items, itemById: items.reduce<Record<Item["id"], Item>((byId, item) => { byId[item.id] = item; return byId; }, {}) } } }), ...

[markerikson]

Sure, although you can use RTK's createEntityAdapter to do that work for you:

• https://redux.js.org/tutorials/essentials/part-8-rtk-query-advanced#transforming-responses

[phryneas]

But keep in mind that each server response is still a single cache entry isolated from all other cache entries. RTK Query is a document cache by nature, not a normalized cache.