TIL-낙관적 UI


optimist.gif

로컬 데이터를 먼저 변조하고 서버에 요청을 보내는 방식

프론트엔드 개발을 하다보면 언제나, 서버 데이터와 로컬 데이터의 상태가 일치해야 하는 상황 속에서 문제를 겪게 된다.

낙관적 UI란, 서버에 로컬 데이터를 동기화하기 전에 먼저 로컬의 변경사항을 UI 상에 렌더링하고, 이후 점진적으로 서버에 로컬 데이터를 동기화하는 접근 방식을 의미한다.

예: 댓글, 게시글을 올렸을 때, 실제로 댓글, 게시글이 서버에 등록되지 않더라도 화면 상에는 댓글이 올라간 것처럼 표시한다면, 이것은 낙관적인 UI라고 부를 수 있음

왜 낙관적이라고 부르나?

“실제로 서버에 데이터가 변조되었는지 여부를 모르지만, 아마 될 거니까 일단 유저에겐 그런 것처럼 보여주자”라는 가설에 의해 동작하기 때문임.

낙관적인 UI의 장점

서비스의 유저 체감속도가 압도적으로 빨라지는 효과가 있음

낙관적인 UI의 단점

실제 서버 데이터의 변조 상태와 UI 상태가 일치하지 않기 때문에 뒤늦게 동기화 오류가 발생할 수 있음

낙관적인 UI의 장점만 취하는 방법

대부분의 경우, 유저는 서버의 데이터 상태를 아주 직접적으로 알 필요가 없습니다.

좋은 소프트웨어는, 유저가 생각하는 대로 서버상에서도 데이터를 움직입니다.

유저가 보이지 않는 곳에서 내부적인 알고리즘을 충분히 잘 작성했고, 데이터의 민감도가 일부 금융정산이나 법률상 계약과 직접적으로 관련있지 않다면 낙관적인 UI 방식을 채택하는 것이 좋습니다.

예를 들어, 95%의 확률로 정상적으로 서버 데이터 동기화가 정상적으로 이뤄질 수 있다면, 유저는 19번의 시도동안 서버 데이터 동기화를 기다리면서 UI를 조작한다면 유저가 머리가 아플 것입니다.

모바일 게임 같은 걸 생각하시면 좋습니다.

모바일 게임에서는 거의 대부분의 데이터 동기화가 낙관적인 가정을 통해서 이뤄집니다. 예를 들어, 내 캐릭터를 움직이면 서버에 내 캐릭터의 동선과 좌표가 나중에 동기화되지만, 내 화면에서는 지금 당장 내 캐릭터가 움직여야 합니다. 이 또한 낙관적인 가정입니다.

그렇게 하지 않고 매 동기화 시점마다 유저가 서버와의 데이터 정합성이 맞는 지 검사를 기다려야 한다면, 유저가 게임을 즐기는 건 불가능하기 때문입니다.

극단적으로 금융앱이나 계약과 관련된 앱이라고 하더라도, 정말 좋은 소프트웨어라면 낙관적 UI라도 잘 동작할 수 있을 것입니다. 낙관적 UI의 실패 상황, 예외 상황이 발생했을 <때에만> 유저에게 알림을 주는 등의 방법으로 실수를 예방할 수 있기 때문입니다.