1. 실시간 동시 편집 기술

다들 많이 써봤을 Google Docs, Notion 등에서 동시에 같은 문서를 편집할 수 있는 것을 체험해보셨을겁니다. 굉장히 유용하고 직관적인 방법이지만 이것을 어떻게 구현하였을까요?
똑같은 위치를 동시에 수정하면 겹쳐서 다른 결과가 나와야할텐데 이를 어떻게 잘 조정하는지 두 가지 방법을 알아보겠습니다.

2. OT (Operational Transformation)

작동원리

글자 변경이라는 operation을 시간 순서에 따라 쭉 기록해 server로 전송합니다.
그 이후 서버에서 순차적으로 변경을 실행해 이전 동작에 의해 바뀐 글자의 인덱스를 수정해 알맞게 transform 시켜줍니다. 그리고 이것을 클라이언트에 반환해 동시 편집을 구현합니다.

장점

• 직관적으로 구현이 가능

단점

• tranform 시켜줄 server가 필수 -> 무거워진다
• 트래픽이 몰리면 서버에 과부하 -> 가끔 구글 Docs에서 보던 사용자 초과 오류?
• 서버가 transform을 위한 연산 시간이 필요해서 반응이 느리다

사용 예

• Google Docs
• MS Office

3. CRDT(Conflict-Free-Replicated Data Types)

작동원리

OT와는 다르게 순서와는 상관 없이 변경사항만 같으면 같은 결과가 나옵니다.
OT는 인덱스 기반이지만, CRDT는 각 문자에 고유한 id를 부여하므로 특별한 연산 없이 merge 하면 되므로, 서버 없이 편집자들끼리 데이터를 주고받으면 됩니다.

장점

• 서버가 필요 없어 가벼움
• 속도가 빠름 - log(n)
• 용량에서 OT 보다 뛰어남
• OT의 기능(REDO/UNDO, 비슷한 구현체 크기 등)을 그대로 갖고 성능 개선

단점

• interleaving: 고유 id가 랜덤하게 부여 된다면 글자가 이상하게 merge 됨 -> 개선 알고리즘 존재(RGA, Treedoc, WOOT)

사용 예

• Figma
• Yorkie
• Redis

시뮬레이션 링크

https://jakelazaroff.com/words/an-interactive-intro-to-crdts/

4. References

https://s-core.co.kr/insight/view/%EC%83%88%EB%A1%9C%EC%9A%B4-%EC%97%85%EB%AC%B4%ED%99%98%EA%B2%BD%EC%9D%98-%EB%8C%80%EB%91%90-%EB%8F%99%EC%8B%9C-%ED%8E%B8%EC%A7%91-%EA%B8%B0%EC%88%A0/

https://news.hada.io/topic?id=2962

https://velog.io/@heelieben/%EC%8B%A4%EC%8B%9C%EA%B0%84-%EB%8F%99%EC%8B%9C-%ED%8E%B8%EC%A7%91-OT-%EC%99%80-CRDT