Размер хранилища: квоты браузеров

idb-keyval — это лёгкая обёртка над IndexedDB, предоставляющая простой API для работы с ключами и значениями. Понимание ограничений по размеру хранилища напрямую связано с особенностями IndexedDB в разных браузерах. IndexedDB создавалась как механизм для хранения значительных объёмов данных на стороне клиента, но фактический лимит зависит от конкретного движка браузера и платформы.

В браузере данные хранятся в «origin storage», то есть привязаны к домену. Общий объём данных, который может занимать веб-приложение, определяется доступной квотой. IndexedDB не имеет встроенного жёсткого ограничения на количество записей или размер объектов, однако браузеры применяют ограничения на общий объём, чтобы предотвратить исчерпание диска пользователя.

Подходы к квотам браузеров

Разные браузеры реализуют управление квотами по-разному. Основные принципы:

  1. Процент от доступного диска Большинство браузеров выделяет для IndexedDB фиксированный процент от свободного пространства пользователя. Например, Chrome может разрешать до 60% свободного пространства для всех origin вместе, но отдельное приложение ограничивается меньшим процентом.

  2. Абсолютные лимиты На мобильных устройствах или в браузерах с жёсткими ограничениями (например, Safari) может действовать абсолютный лимит, измеряемый в мегабайтах. Обычно это диапазон от 50 МБ до 1 ГБ на origin.

  3. Динамическая проверка свободного места Современные браузеры используют API navigator.storage.estimate() для оценки доступного пространства и уже на основе этой оценки разрешают запись данных.

Практическая проверка размера хранилища

Чтобы безопасно работать с idb-keyval и избежать ошибок «QuotaExceededError», полезно проверять доступное пространство.

if ('storage' in navigator && 'estimate' in navigator.storage) {
  navigator.storage.estimate().then(estimate => {
    console.log(`Использовано: ${estimate.usage} байт`);
    console.log(`Доступно: ${estimate.quota} байт`);
  });
}
  • usage — текущий объём, занимаемый origin.
  • quota — максимально доступное пространство для origin с учётом политики браузера.

Эти данные позволяют принимать решения о стратегии сохранения: например, удалять устаревшие ключи или ограничивать размер кэша.

Ограничения отдельных браузеров

Браузер Примерная квота IndexedDB Особенности
Chrome / Chromium ~60% свободного места, но обычно до 2-5 ГБ Ограничение на origin динамически увеличивается с использованием Storage Manager API
Firefox До 50% свободного места При достижении лимита старые данные можно удалить через механизм LRU (Least Recently Used)
Safari (iOS) ~50 МБ по умолчанию После переполнения пользователю предлагается диалог разрешения увеличения квоты
Edge Аналогично Chrome Использует Chromium-ядро, динамически регулирует квоту
Opera Аналогично Chrome

Важно учитывать, что эти значения ориентировочные и могут изменяться с обновлениями браузеров.

Рекомендации по управлению хранилищем в idb-keyval

  • Контроль размера объектов: хранить данные в сжатом виде (JSON.stringify + gzip) для уменьшения занимаемого пространства.
  • Удаление устаревших данных: реализовать механизм TTL (Time To Live) для ключей, чтобы не превышать квоту.
  • Мониторинг квоты: регулярно проверять navigator.storage.estimate() перед крупными операциями записи.
  • Разделение хранилища: при необходимости хранить большие объёмы данных можно использовать несколько баз IndexedDB для разных типов данных, чтобы избежать единого ограничения на origin.

Ошибки и обработка переполнения

При попытке записать данные свыше квоты IndexedDB выбросит исключение QuotaExceededError. В idb-keyval это проявляется как обычный Promise rejection.

import { set } from 'idb-keyval';

async function saveData(key, value) {
  try {
    await set(key, value);
    console.log('Данные сохранены успешно');
  } catch (err) {
    if (err.name === 'QuotaExceededError') {
      console.error('Превышен лимит хранилища');
      // Логика очистки устаревших данных или уведомления пользователя
    } else {
      throw err;
    }
  }
}

Эта стратегия позволяет плавно обрабатывать ситуации, когда приложение достигает предела хранилища, без критических сбоев.

Практический совет

Для веб-приложений с большим количеством локальных данных использование idb-keyval требует планирования: распределение данных по категориям, контроль размера каждой записи, периодическое очищение неиспользуемых ключей и мониторинг доступного пространства. Такой подход позволяет избежать непредвиденных ошибок и эффективно использовать IndexedDB на всех популярных платформах.

Оглавление