Какие основные отличия между LocalStorage, SessionStorage и Cookies в хранении данных в браузере?

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

• LocalStorage:

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

• SessionStorage:

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

• Cookies:

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

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

// Сохранить данные
localStorage.setItem('username', 'user123');

// Получить данные
const user = localStorage.getItem('username');