Что представляет собой localStorage в браузерных приложениях

localStorage — это встроенный в браузер механизм хранения данных на стороне клиента в формате ключ-значение. Информация сохраняется без срока действия и доступна даже после закрытия или перезагрузки страницы.

Краткий ответ

localStorage — это веб-хранилище, предоставляемое браузером для долговременного сохранения данных в виде пар «ключ-значение» на стороне пользователя. В отличие от sessionStorage, данные в localStorage сохраняются постоянно и не удаляются при закрытии вкладки или браузера.

---

Как это работает

localStorage — это часть Web Storage API, позволяющая веб-приложениям сохранять небольшие объёмы данных (обычно до 5-10 МБ) локально в браузере пользователя. Данные записываются и читаются с помощью методов setItem(key, value) и getItem(key). Вся информация хранится в формате строк и не имеет встроенного срока жизни, то есть не удаляется автоматически.

Важное отличие localStorage от cookie — это объём хранилища и отсутствие передачи данных на сервер при каждом запросе, что повышает производительность.

Хранилище	Время жизни	Объём	Доступность
localStorage	Постоянно (пока не удалено вручную)	~5-10 МБ	Только в пределах одного домена
sessionStorage	Пока открыта вкладка	~5 МБ	Только текущая вкладка
cookie	Зависит от срока, указанного в cookie	~4 КБ	Отправляются на сервер при запросах

Пример

// Сохранение данных в localStorage
localStorage.setItem('userToken', 'abc123');

// Получение данных из localStorage
const token = localStorage.getItem('userToken');
console.log(token); // Выведет 'abc123'

// Удаление элемента
localStorage.removeItem('userToken');

// Очистка всего localStorage
localStorage.clear();

В этом примере показано, как записать, прочитать и удалить данные из localStorage с помощью стандартных методов API.

Что важно знать на собеседовании

• localStorage хранит данные в формате ключ-значение без срока жизни.
• Данные доступны только в пределах одного домена и не передаются на сервер автоматически.
• Максимальный размер хранилища обычно ограничен несколькими мегабайтами.
• localStorage синхронен, что может влиять на производительность при большом объёме данных.
• Для удаления данных можно использовать методы removeItem и clear.

---

Тема: Web-тестирование и DevTools | Уровень: junior