IndexedDB for Persistent Image Session History
Storing compression history, settings, and before/after results in the browser using IndexedDB.
ER
Elena Rostova
Contributing Author · Squoosh Next BlogIndexedDB is the browser's built-in transactional database capable of storing arbitrary JavaScript objects including large binary data like image blobs. For an image optimization tool, it enables features like session history (a log of all files compressed, their original and output sizes, codec settings, and timestamps), preset management (saving user-configured codec settings as named presets for reuse), and offline operation (previously compressed output is cached and accessible without internet). The key design consideration is storage quota management.
Browsers grant 60–80% of remaining disk space for IndexedDB, but you should implement a rolling eviction strategy that deletes entries older than 30 days or when total stored size exceeds 500MB. The Squoosh Next session history panel uses IndexedDB with a structured object store indexed by timestamp and file hash.
Key Takeaways
IndexedDB is the browser's built-in transactional database capable of storing arbitrary JavaScript objects including large binary data like image blobs.
For an image optimization tool, it enables features like session history (a log of all files compressed, their original and output sizes, codec settings, and timestamps), preset management (saving user-configured codec settings as named presets for reuse), and offline operation (previously compressed output is cached and accessible without internet).
The key design consideration is storage quota management.
Browsers grant 60–80% of remaining disk space for IndexedDB, but you should implement a rolling eviction strategy that deletes entries older than 30 days or when total stored size exceeds 500MB.
Try It in the Workspace
Everything discussed in this article can be tested directly in Squoosh Next — no sign-up, no upload, 100% client-side.