Как правильно обновлять данные react после обращения к api?

Question

[AlkorIVV]

Возник вопрос, как на большом продакшене обновяляют состояние react после, например, запроса на удаление элемента.
Пример такой. Есть to-do лист, из списка элементов который пришел с сервера по GET запросу.
Пользователь удаляет один элемент, идет запрос DELETE
После удаления, стоит ли снова запросить данные и уже их отобразить или достаточно удалить элемент из state ?
Я пока встречал на проектах только постоянный запрос данных, после каждой операции с бэком, PUT, DELETE, POST, правильный ли это подход? Какие вообще есть подходы на больших проектах?
Спасибо.

Comments

[szQocks]

отправляешь запрос на бэк на удаление - если запрос прошёл успешно, удаляешь с фронта

[szQocks]

обычно на продакшене запросы GET POST и всё

Answer 1

[12rbah]

Пользователь удаляет один элемент, идет запрос DELETE. После удаления, стоит ли снова запросить данные и уже их отобразить или достаточно удалить элемент из state ?

Нужно ориентироваться на статус ответа с бэкенда, если OK, то смело удаляйте, не нужно запрашивать данные еще раз, если нет то пишите об ошибке(в зависимости от кода).

Я пока встречал на проектах только постоянный запрос данных, после каждой операции с бэком, PUT, DELETE, POST, правильный ли это подход?

Т.е. отправляется запрос, с сервера приходит уведомление, что элемент был успешно удалён и вы делаете новый запрос на получение данных? В целом так можно делать, но это лишняя нагрузка на бд и сервер, а для пользователя лишние сетевые задержки, конкретно в этом случае, хз зачем так делать.

Answer 2

[Александр Талалаев]

Изменения в UI до прихода данных с сервера - тн оптимистический подход (Optimistic UI updates).
Советую следовать простому правилу: делать оптимистичные обновления в интерфейсе всегда, кроме случаев когда это критично для пользовательских сценариев(очень редко когда и где нужно). В таком случае ваше приложение будет ощущаться намного более отзывчивым, приятным и быстрым. Ошибки и откаты можно сделать потом, после прихода с сервера ответа с ошибкой.
Советую погуглить "Optimistic UI updates", статей на этот счёт в разном контексте огромное число.

Comments

[Mikhail Osher]

Присоединяюсь к ответу. Добавлю, что всё зависит от бизнес-логики.
Нужно ли бизнесу сразу удалять элемент с UI? А может этот список редактировать кто-то кроме нас? Если да, то хотим ли мы получать новые данные при удалении элемента? Если да, то что должно произойти, если мы попытаемся удалить элемент, который мы получили минуту назад через GET запрос, однако секунду назад этот элемент был удален кем-то другим? Как бизнес хочет, так и делаем (свой бизнес = сами решайте). Нет "правильного" варианта.