Ответ
Во время обработки запроса пользователь видит индикатор загрузки или состояние "ожидания". Это может быть:
- Спиннер/лоадер - анимированный элемент, показывающий, что идёт процесс
function Loader() {
return <div className="spinner"></div>;
}- Скелетон/placeholder - серые блоки, имитирующие будущий контент
- Прогресс-бар - для длительных операций
- Текст статуса ("Загрузка...", "Отправка данных...")
- Затемнение/блокировка интерфейса - чтобы предотвратить новые действия
Лучшие практики:
- Показывать индикатор сразу после действия пользователя
- Для запросов >1 сек добавлять прогресс
- Не блокировать весь интерфейс без необходимости
- Предусматривать состояния ошибок
Ответ 18+ 🔞
Да ты посмотри, какие у нас тут, блядь, варианты для этого несчастного пользователя, который ждёт, пока его запрос доползёт до сервера и обратно! Прямо целый цирк с конями, ёпта!
Ну, первое и самое очевидное — это твой классический спиннер, этакая крутилка-вертилка. Просто чтобы мозги не проветривались, пока что-то там грузится. Код, в принципе, простой, как три копейки:
function Loader() {
return <div className="spinner"></div>;
}Дальше идёт, блядь, скелетон. Это когда на экране вместо контента — серые прямоугольники, как призраки будущих данных. Выглядит, конечно, будто сайт с похмелья, но зато понятно, что что-то будет, и где именно оно появится. Хитро, чёрт возьми!
Если процесс долгий, как моя очередь в ЖЭКе, то тут уже нужен прогресс-бар. Чтобы пользователь видел: о, уже 10%... о, уже 20%... о, бля, опять зависло на 95%, пиздец.
Можно, конечно, и просто текстом статуса тыкать: «Грузим-грузим, не дышим». Но это уже для самых скромных случаев.
А ещё есть вариант заблокировать весь интерфейс, чтобы наш нетерпеливый юзер не успел тыкнуть во все кнопки по десять раз и отправить на сервер тонны одинаковых запросов. Но тут осторожно надо, а то он вообще подумает, что всё сломалось и уйдёт нахуй.
Так как же не облажаться? Правила простые, как палка:
- Не тяни резину. Показал индикатор — сразу, как пользователь кнопку нажал. Не жди, пока он уже в монитор плюнуть захочет.
- Если ждать больше секунды — уже пора показывать какой-то прогресс, а то у человека волнение ебать начнётся: «Оно вообще работает или нет?».
- Не перекрывай всё, как танк. Блокируй только то, что нужно, оставь человеку возможность, например, отменить действие.
- И, наконец, главное! Всегда, блядь, предусматривай, что всё может пойти по пизде! Сервер ляжет, сеть отвалится, данные придут кривые. Надо показать внятную ошибку, а не просто зависшую крутилку до скончания веков. Иначе пользователь реально охуеет.