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

Особенности хранилищ: разный объём и срок жизни, только cookie отправляется на сервер, storage хранит только строки и уязвим к XSS, IndexedDB асинхронный, изоляция по origin.

Особенности

Разный объём и срок жизни

• Cookie ~4 КБ, localStorage/session ~5–10 МБ, IndexedDB — большие объёмы.
• localStorage — бессрочно, sessionStorage — на вкладку, cookie — настраивается.

Только cookie шлётся на сервер

Cookie автоматически отправляется с каждым запросом; storage и IndexedDB — только на клиенте.

Только строки (Web Storage)

localStorage/sessionStorage хранят строки — объекты сериализуют через JSON:

localStorage.setItem('user', JSON.stringify(user));

IndexedDB хранит структурированные данные (объекты, файлы).

Синхронность

• localStorage/sessionStorage — синхронные (большие объёмы блокируют поток).
• IndexedDB — асинхронный (не блокирует).

Уязвимость к XSS

Storage доступен любому JS — токены там уязвимы. Cookie с HttpOnly защищена.

Изоляция по origin

Все хранилища изолированы по origin; sessionStorage — ещё и по вкладке.

События

localStorage вызывает событие storage в других вкладках (синхронизация).

Практические выводы

• Секреты не в storage (XSS).
• Большие данные — IndexedDB (асинхронный).
• Данные для сервера — cookie.
• Объекты в storage — через JSON.

Коротко для собеседования

Особенности хранилищ: разный объём/срок (cookie ~4 КБ, storage ~5–10 МБ, IndexedDB — большой); только cookie шлётся на сервер; Web Storage хранит строки (JSON) и синхронный, IndexedDB — структурированный и асинхронный; storage уязвим к XSS (cookie — HttpOnly); изоляция по origin; storage-событие между вкладками.