Optimistic - UI

Optimistic UI란?

• 단어 그대로 낙관적으로 생각하는 UI이다.
• 서버로부터 받는 응답이 대부분 오류가 나지 않을 것이다, 성공적일 것이다라고 가정하고 사용자에게 성공했을 때의 결과를 바로 보여주는 것이다

간단한 예시

1. 사용자가 👍 버튼을 누른다.
2. 좋아요 갯수가 1개 증가한 UI를 바로 보여준다.
3. 서버에 mutation을 요청한다.
4. 서버에서 응답을 받는다.

그렇다면 우리는 만약 과정 속에서 오류가 생기면 어떡하나 라는 생각을 할 수 있다!

오류가 발생했을 경우

• 조용히 원래대로 되돌려 놓는다! >>> ㅋㅋㅋ

간단한 예시
중고마켓에서 찜하기 버튼을 생각해봅시다.

1. 사용자가 찜하기 🤍 버튼을 누른다.
2. 💛 버튼 색상이 바뀌면서 찜이 되었음을 바로 알려준다.
3. 서버에 요청한다.
4. 서버에서 실패했다는 응답을 받는다.
5. 조용히 찜하기 버튼의 🤍색깔을 변경한다.