Ответ
В браузере есть несколько способов хранения данных:
- LocalStorage - хранит данные без срока действия, даже после закрытия браузера.
localStorage.setItem('key', 'value');
const data = localStorage.getItem('key');-
SessionStorage - аналогичен LocalStorage, но очищается при закрытии вкладки.
-
Cookies - небольшие текстовые файлы с ограниченным размером (~4KB), можно установить срок жизни.
document.cookie = "username=John; expires=Thu, 18 Dec 2023 12:00:00 UTC";-
IndexedDB - NoSQL база данных для хранения больших объемов структурированных данных.
-
Cache API - используется для хранения ответов от сервера (часто в Service Workers).
Для сложных приложений лучше использовать IndexedDB, для простых - LocalStorage. Cookies подходят для небольших данных, которые нужно отправлять на сервер.
Ответ 18+ 🔞
А, ну вот, слушай, классика жанра — как в браузере данные припрятать, чтобы не улетучились, как твоя зарплата в пятницу вечером. Тут, блядь, целый зоопарк вариантов, на любой вкус и цвет.
Первый кандидат — LocalStorage. Это как твой старый дед, который всё помнит, даже то, как ты в пятом классе штаны порвал. Данные там сият вечно, пока их вручную не выковыряешь или пользователь не почистит кэш. Проще пареной репы:
localStorage.setItem('key', 'value'); // Засунул
const data = localStorage.getItem('key'); // ДосталВторой — SessionStorage. Это его младший брат-распиздяй, который всё забывает, как только вкладку закрыл. Уснул — и память чиста. API такой же, но философия — пиздец.
Дальше идут Cookies. Эти, блядь, старожилы, ещё со времён, когда интернет был на костылях. Маленькие, дохуя не поместится (~4 КБ), но их можно с сроком годности сделать, как творог. И главное — они автоматом летят на сервер с каждым запросом, что иногда охуенно удобно, а иногда — просто пиздец как раздражает.
document.cookie = "username=John; expires=Thu, 18 Dec 2023 12:00:00 UTC"; // Поставил печенькуА теперь, внимание, ёпта, IndexedDB. Это уже не шутки. Это полноценная, блядь, NoSQL база данных прямо в браузере. Для тех случаев, когда тебе мало просто ключ-значение, а хочется хранить овердохуища структурированных данных, с индексами и транзакциями. Сложновато, конечно, но мощно — как трактор.
Ну и Cache API — это уже для продвинутых шаманов, которые с Service Workers'ами дружат. Идеально, чтобы закешировать ответы от сервера и потом оффлайн приложение работало, будто так и надо.
Итог, сука:
Для простой хуйни вроде темы сайта или токена — LocalStorage, и не еби мозг.
Cookies — если нужно, чтобы сервер это видел (авторизация, например).
А если затеял какую-то тяжелую, блядь, SPA-шку с тоннами данных — садись изучать IndexedDB, другого пути нет, в рот меня чих-пых.
Cache — когда делаешь оффлайн-фичи или Progressive Web App.
Вот и вся наука, ебать.