Move frontend caching from local storage to IndexedDB
What does this MR do and why?
This MR acts as a follow-up to !106004 (merged). Previously, we were caching data in the localStorage
, this MR replaces localStorage
with IndexedDB. On top of this, now we're storing GraphQL objects in their respective IndexedDB tables so we can access e.g. project
directly by project id
, without a need to read project query first.
Screenshots or screen recordings
No visual changes
How to set up and validate locally
-
Enable the caching feature flag
Feature.enable(:frontend_caching)
-
Open the issues list of any project:
http://127.0.0.1:3000/flightjs/Flight/-/issues
-
Refresh the page. You shouldn't see a skeleton loader this time.
-
Go to the second page of the issues and observe the skeleton loader.
-
Refresh the page - no skeleton loader this time as the second page is cached.
-
Create a new issue and open the first page of the issues list again.
-
Initially, you should see an old list, and then a new issue should appear on top of it.
-
Open devtools ->
Application
->Storage
->IndexedDB
-
You should see at least
queries
table withissues_list
field
MR acceptance checklist
This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.
-
I have evaluated the MR acceptance checklist for this MR.