SWR provides a way to use a custom cache provider. We now store the API calls in local storage as soon as the user reloads the page/exits the tab.
Example below with each API call throttled by 1 second:
Without cache (approx 12 seconds):
With cache (near instant):
The API calls are still being made - but since the results are cached, we're able to show the UI instantly. We still need to cache the APIs on the backend though.
Next steps:
Avoid network request waterfalls (currently fetching users > channels > members > messages). We can remove all Context and reduce number of re-renders - just use SWR hooks directly and load everything in parallel.
Avoid layout shifts when loading - remove all spinners and replace with perfectly sized skeleton loaders/boxes.
SWR provides a way to use a custom cache provider. We now store the API calls in local storage as soon as the user reloads the page/exits the tab.
Example below with each API call throttled by 1 second:
Without cache (approx 12 seconds):
With cache (near instant):
The API calls are still being made - but since the results are cached, we're able to show the UI instantly. We still need to cache the APIs on the backend though.
Next steps: