IndexedDB

IndexedDB is a low-level browser API for storing significant amounts of structured data on the client, including objects, files and blobs. It is a transactional, asynchronous, key-value style database with indexes that allow efficient lookups, and it is scoped to the site's origin.

Why it matters

Local storage is synchronous, limited to strings and typically holds only a few megabytes. IndexedDB can hold far more, subject to browser quotas, and does not block the main thread. This makes it the foundation for offline-capable apps, cached API data, drafts and queued uploads, often together with a service worker. Its raw API is verbose, so many projects use wrapper libraries such as idb or Dexie.

Example

const open = indexedDB.open("notes-db", 1);
open.onupgradeneeded = () => {
  open.result.createObjectStore("notes", { keyPath: "id" });
};
open.onsuccess = () => {
  const tx = open.result.transaction("notes", "readwrite");
  tx.objectStore("notes").put({ id: 1, text: "Hello" });
};

Schema changes happen only inside onupgradeneeded, triggered by raising the version number.

Common mistakes

• Assuming data is permanent; browsers may evict it under storage pressure unless persistence is granted.
• Forgetting that a transaction closes once you await unrelated promises.
• Changing the schema without bumping the version.

Related

• Local storage
• Session storage
• Service worker
• PWA

This page is general information written by our editorial team and updated when documentation changes. Servers and providers differ, so test changes safely first. See our editorial policy and disclaimer.