Как используется IndexedDB в браузере

Что проверяют

Знаете ли вы IndexedDB дальше примера с indexedDB.open: транзакции, версии схемы, лимиты и отличие от localStorage. Следом спрашивают, где вы её применяли и почему не взяли обёртку.

Как отвечать

IndexedDB это асинхронная транзакционная база внутри браузера, привязанная к origin. Ключевые понятия:

• хранилища объектов: аналог таблиц, создаются с keyPath или autoIncrement. Значения сохраняются через structured clone, так что можно класть объекты, Date, Blob, File, ArrayBuffer, но не функции и не DOM-узлы;
• индексы: createIndex по полю, дальше поиск через index.get, getAll и курсоры с IDBKeyRange для диапазонов;
• версии: indexedDB.open(name, version), менять схему можно только в onupgradeneeded. Если другая вкладка держит старую версию, придёт событие blocked, а в той вкладке нужно обработать versionchange и закрыть соединение;
• транзакции: readonly или readwrite, коммитятся автоматически, когда в них не осталось ожидающих запросов;
• доступность: работает в Web Worker и Service Worker, в отличие от синхронного localStorage, который хранит только строки и ограничен несколькими мегабайтами.

Про лимиты: квота общая на origin и зависит от браузера и свободного места. Узнать её можно через navigator.storage.estimate(), попросить не вытеснять данные через navigator.storage.persist(). Safari может стереть данные сайта, с которым пользователь не взаимодействовал около недели.

Сценарии: офлайн-кэш вместе с Service Worker, черновики форм, очередь запросов до восстановления сети, большие справочники. В проекте удобнее обёртки: idb даёт промисы поверх того же API, Dexie добавляет запросы и миграции.

Где спотыкаются

Делают await fetch() посреди транзакции. Пока ждут сеть, транзакция успевает закоммититься, и следующая операция падает с TransactionInactiveError.

Считают IndexedDB надёжным хранилищем. Данные может стереть пользователь или браузер при нехватке места, поэтому источником правды остаётся сервер.

Забывают про миграции: поменяли структуру, не подняв версию, и у клиентов со старой схемой код падает на обращении к несуществующему хранилищу.