Блок 2 · Урок 5 из 5

Почему данные пропадают

Главный диагностический навык блока: понять, на каком из трёх уровней лежали данные — и почему «пропажа» почти всегда означает «лежали не там, где вы думали».

⏱ ≈ 7 минут 🔍 диагностика 🎯 цель: мгновенно понимать, почему данные «исчезли»

Зачем это вам

Это ваш диагностический инструмент №1. Когда вы тестируете приложение агента и что-то «пропало» — вы не паникуете, а задаёте один вопрос: на каком уровне это лежало? И сразу ставите агенту точную задачу: «сделай, чтобы корзина переживала перезагрузку» (→ нужно хранилище или база), «чтобы профиль был виден на всех устройствах» (→ нужен сервер и база), «настрой бэкапы базы» (→ чтобы не потерять навсегда). Три блока этого курса — состояние, хранилище браузера, база данных — ведут к одному практическому навыку: мгновенно понять, где именно лежали данные и почему они исчезли.

Синтез блока

Три уровня хранения — и что каждый переживает

Данные в веб-приложении могут жить в трёх местах. Каждое место имеет свой «срок хранения» — и именно его несовпадение с ожиданиями вызывает почти все случаи «исчезновения» данных.

Уровень Где живёт Что переживает Когда пропадает
Состояние (state) Оперативная память вкладки браузера Ничего — только пока вкладка открыта При перезагрузке страницы, закрытии вкладки или браузера
Хранилище браузера (localStorage, куки) На диске устройства пользователя1 Перезагрузку страницы и браузера При очистке кэша/данных браузера, в режиме инкогнито1, на другом устройстве или другом браузере
База данных (на сервере) На сервере — отдельно от пользователя Всё: перезагрузку, смену устройства, смену браузера Только при явном удалении данных, ошибочной миграции — или если нет бэкапа2

Первый уровень — состояние (state) — самый эфемерный. Это просто переменные в памяти текущей вкладки: пропадают, как только страница перезагружается. Никакого следа на диске.

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

Третий уровень — база данных на сервере — самый надёжный. Данные живут вне браузера и вне устройства. Видны с любого устройства, любого браузера, в любом режиме. Можно настроить бэкапы (резервные копии).

Дерево диагностики: три вопроса по очереди

Симптом Где лежали данные Что делать
Пропало после F5 / перезагрузки страницы Только в состоянии (RAM вкладки) Сохранять в хранилище браузера или базу в зависимости от нужной надёжности
Есть после перезагрузки, но нет на другом устройстве или после очистки кэша В хранилище браузера (локально на устройстве), а не на сервере Перенести хранение на сервер — в базу данных
Должно быть, но исчезло у всех пользователей Было в базе, но что-то пошло не так на сервере Проверить: не сохранилось, было удалено, миграция/деплой задели данные — и восстановить из бэкапа

Есть ещё несколько причин «пропажи», которые на первый взгляд выглядят как исчезновение данных. Запрос к серверу упал с ошибкой — данные вроде бы отправились, но не сохранились (ошибка сети или код 500 от сервера). Так называемое «оптимистичное обновление» (optimistic update) — интерфейс уже показал результат, а сервер его отверг: данные исчезли с экрана, хотя казалось, что всё сохранено. Или кэш (временная копия) показывает старую версию, хотя данные уже изменились на сервере. Всё это — тема следующего блока, про то, как приложения общаются.

📌 «Данные пропали» почти всегда = данные были не на том уровне, на каком вы их ждали. Три вопроса — пережило F5? видно на другом устройстве? есть бэкап? — сразу показывают, где искать.

Аналогия, которую можно пересказать

Три места, где оставить вещь

«Стол перед собой»— состояние (RAM): удобно прямо сейчас, но вечером уборщик сметёт. После перезагрузки — пусто.
«Шкаф дома»— хранилище браузера: будет завтра, переживёт перезагрузку. Но только у вас дома — в офисе (на другом устройстве) этого нет.
«Ячейка на складе под охраной»— база на сервере: доступна отовсюду, надёжна, есть опись (бэкап). Единственный уровень, который не зависит от устройства.
«Вещь пропала»— вы ищете в ячейке, а положили на стол. Данные никуда не делись — они просто хранились не там, где вы искали.

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

Запомните одно

Любая «пропажа» — это несовпадение уровня ожиданиям

Почти любое «исчезновение данных» — не мистика, а диагностируемая ситуация. Три вопроса по очереди: пережило перезагрузку? видно на другом устройстве? есть бэкап? — и вы точно знаете, на каком уровне проблема и что просить у агента.

Когда понимаете уровень — формулировка задачи агенту становится точной: не «данные пропали, почини», а «корзина хранится только в state, нужно перенести в localStorage» или «профили должны быть в базе, сейчас лежат в localStorage».

Что это даёт на практике

Фраза агента → что он имеет в виду

«Данные были только в state»
Лежали в памяти вкладки; перезагрузка их стёрла. Надо сохранять в базу или хранилище браузера — зависит от того, нужны ли данные на других устройствах.
«Нужно персистентное хранилище»
Хранить так, чтобы пережило перезагрузку. Персистентность (persistence) — свойство данных сохраняться после закрытия. Это или хранилище браузера, или база на сервере.
«Это в localStorage, а не на сервере»
Поэтому на другом устройстве пусто — данные живут только в этом браузере. Если нужно везде, надо переносить на сервер.
«Похоже, миграция/деплой затронули данные»
При обновлении структуры или кода базы что-то задело реальные данные — удалило, изменило. Нужен бэкап, чтобы восстановить. Именно поэтому бэкапы обязательны перед любыми миграциями.

Три уровня хранения — состояние (память вкладки) / хранилище браузера (диск устройства) / база данных (сервер). Каждый следующий надёжнее и шире по охвату.

Персистентность (persistence) — свойство данных сохраняться после перезагрузки страницы или закрытия браузера. Состояние не персистентно; хранилище браузера и база — персистентны.

Бэкап (backup) — резервная копия базы данных, чтобы восстановить информацию после сбоя, ошибки или случайного удаления. Без бэкапа потеря данных на сервере может быть необратимой.

Кэш (cache) — временно сохранённая копия данных для ускорения работы. Иногда показывает устаревшую версию, даже когда на сервере данные уже изменились.

Проверьте себя

Четыре вопроса с мгновенной проверкой

1. Пользователь ввёл данные, нажал F5 — всё пропало. Где они были?

2. Данные есть после перезагрузки, но на телефоне их нет. Где они?

3. Какой уровень хранения самый надёжный и доступен со всех устройств?

4. Чтобы важные данные не пропали при сбое или ошибочной миграции, нужно…

Куда мы идём

Программа курса — 7 блоков