optimistic-ui

optimistic-ui

Optimistic UI는 단어 그대로 낙관적으로 생각하는 UI 이다.

한 가지 예시를 들자!
사용자가 좋아요 버튼을 누른다.
onClick 함수가 실행되고 서버에 mutation 요청을 보낸다.
서버에 보낸 요청이 완료될 때까지 await으로 기다린다.
완료가 되었으면 refetch로 좋아요 갯수 데이터를 다시 가져온다.
가져온 데이터를 화면에 보여준다.

좋아요 기능을 생각하면 상당히 단순히 좋아요의 갯수를 +1 해주는 기능인데 이렇게 많은 과정을 거쳐야 한다.

Optimistic UI는 좋아요 버튼을 클릭했을시 성공했다고 간주하고 바로 갯수를 +1 해준다. 혹시라도 좋아요 기능이 실패한다면 조용히 원래상태로 되돌린다. Optimistic UI는 기본적으로 성공했다고 간주하는 것이기 때문에 중요한 기능에서는 사용 못하고 좋아요 기능처럼 단순한 기능에 사용할수 있다.