localStorage, sessionStorage, cookie, IndexedDB
Вопрос
Чем отличаются способы хранить данные в браузере?
Попробуйте сами
Ответьте вслух за 2 минуты, как на собесе. Потом сверьтесь с тезисами: что прозвучало, а что нет.
Показать ответ и разбор
Коротко
Что должно прозвучать в ответе
localStorage - синхронный, около 5 МБ, живёт до очистки
sessionStorage - то же, но на вкладку и до её закрытия
cookie уходит с каждым запросом и ограничена 4 КБ
IndexedDB - асинхронная, большие объёмы, структурированные данные
синхронность localStorage блокирует поток
токен в localStorage уязвим к XSS, httpOnly-cookie - нет
Что могут спросить следом
- Где хранить JWT и почему
- Что такое SameSite и от чего он защищает
- Как пережить приватный режим, где хранилище недоступно
Разбор
localStorage - синхронное хранилище строк, около 5 МБ, переживает перезагрузку.
sessionStorage - то же, но изолировано на вкладку. Синхронность важна: чтение большого
значения блокирует поток, поэтому в критическом пути отрисовки его лучше не трогать.
Cookie отправляется на сервер с каждым запросом - отсюда лимит 4 КБ и требование не класть
туда ничего лишнего. Зато httpOnly-cookie недоступна из JS и потому устойчива к XSS,
в отличие от токена в localStorage.
IndexedDB - асинхронная база для больших объёмов и структур: офлайн-режим, кэш картинок, очередь неотправленных действий.
Ответьте сами, а не прочитайте
В тренажёре вопрос попадёт в повторения и вернётся, когда начнёт забываться. Плюс билеты с зачётом: 20 вопросов, не больше 2 ошибок.