반응형
useOptimistic
-
React useOptimistic vs React Query optimistic updates: 낙관적 업데이트, 무엇을 선택할까?React 2025. 9. 1. 18:59
사용자가 어떤 액션을 취했을 때 서버 응답을 기다리지 않고 UI에 미리 성공한 것처럼 반영하는 것을 낙관적 업데이트라고 합니다. 예를 들어 SNS에서 댓글을 달면 서버 응답 전에 곧바로 댓글이 화면에 나타나고 “전송 중...”이라고 표시되는 경험을 본 적이 있을 것입니다.성공 시에는 그대로 두고, 실패 시에는 UI를 다시 원래대로 돌립니다. 이러한 기법은 미묘한 시간 지연으로 인한 답답함을 줄여 사용자 경험을 개선하지만, 동시에 실패 시 UI를 되돌리고 오류를 알리는 처리가 중요합니다. 낙관적 UI 업데이트를 활용하면 서버 처리 중에도 “Sending...”과 같은 상태를 즉시 표시할 수 있습니다. 위 이미지는 사용자가 댓글을 작성하자마자 UI에 (Sending...) 라벨이 나타나는 예시입니다. 서버 ..