낙관적 업데이트가 막힐 때 배포 전 체크

낙관적 업데이트는 강력하지만, 서버 응답이 바뀌면 UI 상태와 실제 데이터가 어긋난다. 배포 전에 미리 점검하면 운영 중 버그를 줄일 수 있다.

낙관적 업데이트 흐름 정리

먼저 어떤 액션이 낙관적으로 동작하는지 목록으로 만든다. 예를 들어:

• 게시물 좋아요 (클릭 즉시 버튼 상태 변경)
• 댓글 작성 (전송 버튼 누르면 즉시 목록에 추가)
• 프로필 수정 (저장 클릭 시 즉시 화면 반영)

각 액션마다 정상 시나리오와 실패 시나리오를 생각해본다.

네트워크 지연 시뮬레이션

개발자 도구의 Network 탭에서 "Throttling"을 설정해서 느린 네트워크를 시뮬레이션한다. 그리고:

• 액션 실행
• 즉시 화면이 바뀌는지 확인
• 서버 응답까지 기다렸을 때 화면이 다시 바뀌는지 확인
• 응답 후 최종 상태가 맞는지 검증

이때 콘솔에서 오류가 나지 않는지도 같이 본다.

오류 복구 테스트

서버에서 요청을 거부하는 경우를 테스트해야 한다. API를 임시로 수정해서:

• 404 반환
• 403 권한 없음 반환
• 500 서버 에러 반환

각 경우에 UI가 적절히 복구되는가 확인한다. 낙관적으로 바뀐 상태가 원래대로 되돌아가야 한다.

# 테스트를 위해 API 응답을 임시로 수정
# POST /api/like -> 403 Forbidden

상태 불일치 감지

만약 사용자가 액션을 실행했는데 서버에서는 실패했다면, 수동으로 다시 시도할 수 있는 UI가 있어야 한다. 또는 일정 시간 후 자동으로 동기화한다.

소셜 앱들이 "업로드 재시도" 버튼을 제공하는 이유가 이것이다. 구현했는지 확인한다.

연쇄 액션 테스트

사용자가 빠르게 여러 액션을 연달아 실행하는 경우를 생각해본다.

• 좋아요 누르고 즉시 취소
• 댓글 두 개를 빠르게 작성
• 프로필과 설정을 동시에 수정

이런 경우에 상태가 꼬이지 않는지 테스트한다.

배포 전 최종 확인

배포하기 전에 하나씩 다시 확인한다:

• 모든 낙관적 업데이트가 정상적으로 반영되는가?
• 실패했을 때 복구되는가?
• 오류 메시지가 명확한가?
• 사용자가 재시도할 수 있는가?

하나라도 의심스럽다면 운영 환경에 나가기 전에 수정한다.