Help centre
Answer
What is the Cache Storage API?
Short answer
The Cache Storage API is a browser-native key-value store for Request/Response object pairs, accessible from both a service worker and the page via the global caches object. It is the primary mechanism PWAs use to store network responses — HTML, CSS, JS, images, API JSON — so they can be served offline or instantly on repeat visits.
By InstantPWA engineering·Reviewed July 25, 2026
Basic usage
caches.open("v1") returns a Cache object; cache.put(request, response) stores an entry; cache.match(request) retrieves it.
Relationship to IndexedDB
Cache Storage is optimised for storing whole HTTP responses; IndexedDB is a general-purpose structured database better suited to querying app data.
Storage quota
Cache Storage shares the same per-origin quota as IndexedDB and OPFS, which is evictable unless the origin has persistent storage granted.
Sources
Related
What are the storage limits for a PWA?
A PWA typically gets 60% of the device disk space on Chrome and Edge (up to hundreds of GB), 20% of total quota on Firefox, and around 1 GB on Safari. Cache Storage, IndexedDB and OPFS share the same quota. Browsers evict least-recently-used origins under pressure unless the site requests persistent storage.
IndexedDB vs localStorage: which should a PWA use?
localStorage is a simple synchronous key-value store limited to strings and roughly 5-10MB, and it is not accessible from inside a service worker. IndexedDB is an asynchronous, transactional database that can store structured objects, blobs and much larger amounts of data, and it is accessible from both the page and the service worker — making it the right choice for most PWA data storage.
Can a PWA lock screen orientation?
Yes. The Screen Orientation API’s screen.orientation.lock("landscape") method (or "portrait") can force a specific orientation, but on most browsers it only works while the page is in fullscreen mode via the Fullscreen API. An installed PWA can also declare a preferred orientation directly in its manifest with the "orientation" field, which locks orientation for the whole standalone app.
How does a PWA enter fullscreen mode?
A PWA can enter fullscreen two ways: programmatically, by calling element.requestFullscreen() in response to a user gesture (common for games and video players), or declaratively, by setting the manifest’s "display" field to "fullscreen" so the installed app always launches without any system UI at all, including the status bar.
Can a PWA vibrate the device?
Yes, on Android. Calling navigator.vibrate(200) (milliseconds, or an array of on/off durations) triggers haptic vibration on Android Chrome and other Chromium Android browsers, commonly used for game feedback or notification cues. iOS Safari does not implement the Vibration API at all, so it has no effect on iPhone or iPad.