Какие ограничения по размеру есть у браузерных хранилищ?

Ограничения браузерных хранилищ

Браузерные хранилища, такие как localStorage, sessionStorage и cookies, имеют строгие лимиты по размеру, установленные производителями браузеров. Эти ограничения влияют на то, какие данные можно хранить на клиенте без потери производительности или ошибок.

localStorage и sessionStorage

Оба хранилища используют одинаковые лимиты, обычно от 5 до 10 МБ на домен. Например, в Chrome и Firefox лимит составляет 5 МБ, а в Opera — до 10 МБ. Если превысить лимит, браузер выбросит исключение QuotaExceededError. Эти хранилища подходят для кэширования данных, но не для больших файлов.

try {
  localStorage.setItem('key', 'value');
} catch (e) {
  if (e.name === 'QuotaExceededError') {
    console.log('Превышен лимит хранилища');
  }
}

Cookies

Cookies имеют гораздо меньший лимит: 4 КБ на одну куку и обычно до 20-50 кук на домен (зависит от браузера). Они передаются с каждым HTTP-запросом, поэтому их размер критичен для производительности. Cookies лучше использовать только для аутентификации или идентификации, а не для хранения больших данных.

Вывод

Выбор хранилища зависит от задачи: для небольших данных (до 4 КБ) подходят cookies, для средних (до 5-10 МБ) — localStorage или sessionStorage. Для больших объемов данных используйте серверные базы данных или IndexedDB, которая имеет лимиты до нескольких сотен МБ.