optimistic-ui

optimistic-ui

우리가 자유게시판에서 좋아요 버튼을 누를 때 환경에 따라 좋아요의 수가 올라가는 속도가 다르다.

좋아요 버튼을 누르게 되면 백엔드에 likeBoard라는 api에 요청을 보내게 되고, 백엔드는 DB에 요청을 하게 된다.

그럼 DB는 좋아요의 수를 올려두고 올린 좋아요 수를 응답한다. 해당응답을 백엔드는 다시 브라우저에 응답해주는 것.

그런데 느린환경의 컴퓨터라면, 혹은 백엔드 컴퓨터가 굉장히 먼 곳에 있다면 해당과정이 굉장히 지연될 수 있다.

따라서 옵티미스틱 UI를 사용한다.

옵티미스틱 UI란 요청이 서버에 도달하기도 전에 화면의 값을 바꿔버리는 것.

즉, likeBoard를 요청하기도 전에 화면에 13으로 바꿔버리고 계속해서 요청을 보내는 것이다.

그리고 요청이 성공하고 나면 13이 응답으로 돌아올텐데 그때 다시 화면을 업데이트한다. 하지만 이미 옵티미스틱 UI로 13을 그려줬기때문에 유저가 보기에는 똑같다.

만일 중간에 네트워크 문제나 다른이유로 실패하게 된다면, 이전의 값을 응답으로 보내주고 이전의 값을 화면에 업데이트 해준다.

옵티미스틱 UI를 사용해야 할 곳과 사용하지 말아야 할 곳

• 옵티미스틱 UI는 보통 실패 확률이 낮고 틀려도 괜찮은 중요하지 않은 데이터를 보여줄때 사용한다.
• 데이터가 굉장히 중요하고 안정성이 필요할때는 옵티미스틱을 사용하면 안된다.