Сохранение
прогресса игрока

Рекорд, который исчезает — это больно

Представь: друг играет в твою игру, выбивает 148 очков, орёт на весь класс, обновляет страницу, чтобы сыграть ещё — и видит ноль. Не только счёт обнулился, обнулилось и его желание играть. Всё, что он сделал, приложение забыло.

Так работает состояние по умолчанию: оно живёт в памяти вкладки. Закрыл вкладку — память очистилась. Для таймера это нормально. Для игры с рекордом, трекера привычек или списка дел — катастрофа.

Чинится одной фразой в Bolt. Но сначала надо понять, куда именно приложение будет складывать то, что помнит, — иначе не сообразишь, почему рекорд пропал на телефоне друга, хотя «сохранение же сделали».

Штука называется localStorage — дословно «местное хранилище». Твой личный шкафчик внутри браузера. Дальше объясняем на пальцах, зачем «местное» и почему это важно.

Шкафчик в раздевалке браузера

🗄 localStorage

Представь раздевалку в спортзале. У каждого сайта там свой шкафчик. Приложение кладёт туда записки: «рекорд = 148», «тема = тёмная», «отмеченные дни = 3, 5, 6». Открываешь сайт снова — приложение лезет в шкафчик и достаёт записки. Всё, это и есть localStorage.

✅ Лежит долго

Данные не пропадают при закрытии вкладки, перезагрузке и выключении компьютера. Могут лежать месяцами.

📍 Шкафчик локальный

Он привязан к конкретному браузеру на конкретном устройстве. Открыл свою игру на телефоне друга — там пустой шкафчик, рекорда нет. Это не баг.

🧹 Чистится вместе с кэшем

«Очистить историю и данные сайтов» = выкинуть всё из шкафчика. И режим инкогнито тоже стирает всё при закрытии.

💡 Отсюда важное следствие: общего рейтинга «кто круче в классе» на localStorage не сделать . У каждого свой шкафчик, они друг друга не видят. Для общей таблицы нужен сервер — это уже другой уровень, и он не про этот модуль. Рекорд «мой личный» — делаем сегодня.

📝 Промпт, который это включает

«Сохраняй рекорд в localStorage браузера. При загрузке страницы подставляй сохранённое значение. Если сохранённого нет — показывай 0.»

Три части: что сохранять · когда доставать · что делать, если пусто. Третья часть — тот самый граничный случай из прошлого урока: первый заход, когда шкафчик ещё пустой.

Сохранять или не сохранять

🎯 ТРЕНАЖЁР

В шкафчик лезут не всё подряд. Хорошее правило: сохраняем то, что обидно потерять . Всё остальное приложение спокойно посчитает заново. Четыре штуки — реши по каждой. +5 за верный ответ.

Какой промпт сработает

📝 ФОРМУЛИРОВКИ

Три ситуации, в каждой — три способа попросить. Разница между ними в одном: понятно ли, что именно сохранять и когда доставать . +5 за верный выбор.

📋 Как проверить, что сохранение реально работает

1. Набери результат, который жалко потерять 2. Обнови страницу — значение должно остаться 3. Закрой вкладку целиком и открой заново — тоже должно остаться 4. Открой в режиме инкогнито — там будет пусто, и это правильно 5. Проверь первый заход: на пустом шкафчике не должно быть «undefined» или «NaN»

Что твоё приложение будет помнить Что сохраняешь, что не сохраняешь и что видит человек при первом заходе?