Чем отличаются механизмы хранения данных в LocalStorage, SessionStorage и cookies в браузере?

LocalStorage, SessionStorage и cookies — это три механизма хранения данных в браузере, отличающиеся по объему, времени жизни и доступности.

• LocalStorage

  • Хранит данные без срока истечения (пока не удалены вручную).
  • Объем обычно около 5-10 МБ.
  • Данные доступны на всех вкладках и окнах одного домена.
  • Не отправляется на сервер при HTTP-запросах.

• SessionStorage

  • Данные живут только в рамках одной сессии (пока открыта вкладка).
  • Объем похож на LocalStorage.
  • Данные доступны только в текущей вкладке/окне.
  • Не отправляется на сервер.

• Cookies

  • Могут иметь срок жизни, после которого удаляются.
  • Объем ограничен (около 4 КБ на cookie).
  • Данные автоматически отправляются на сервер при каждом запросе к соответствующему домену.
  • Используются для аутентификации, отслеживания и др.

Пример использования LocalStorage:

localStorage.setItem('user', 'Alice');
const user = localStorage.getItem('user');