화이트보드 공유를 구현하기 위한 과정을 정리합니다.

<aside> 📝 목차

</aside>

💭 1. 강의자 canvas의 내용을 어떻게 참여자에게 전달해서 표시해야 하는가?

총 3가지 방법을 두고 간단하게 장단점을 적어가며 고민해 보았습니다.

1. 로그 기반 변경사항 전달
   • 장점 : 변경사항을 전달하는데 필요한 데이터가 적다. (변경된 사항만 전달하면 된다.)
   • 단점 : 구현 방식이 난해함. 비동기적으로 변경사항을 전달해야 함 -> (채팅 서버와 비슷한 방식으로 구현해야 함), 중간에 사용자가 입장하면 그동안의 로그를 다 반영해야 함
2. canvas의 내용을 json으로 만들어 실시간으로 전달
   • 장점 : 데이터 전송 과정에서 더 많은 기술적 도전 가능(변경사항 없으면 전달 x), canvas의 내용을 참여자에게 똑같이 표현할 수 있음
   • 단점 : 화이트보드 정보를 전송하고 불러오는 과정이 복잡함, 데이터가 많아졌을 때 오버헤드가 발생할 가능성이 있다, 다시보기 기능을 구현하기 어려움(시간 단위로 데이터를 저장해야 함)
3. canvas의 내용을 미디어 스트림(비디오 형태)으로 만들어 전달
   • 장점 : 이미 사용하고 있는 미디어 서버를 활용할 수 있다, 강의자가 보낸 데이터를 렌더링하는 과정이 간단함, 다시보기 서비스 구현이 쉬움 (비디오 형태로 저장 가능)
   • 단점 : 비디오 형태의 전달이 부담이 될 수 있다. 캔버스의 내용을 비디오로 만드는 과정에서 화질 손실이 일어날 수 있다.

이 세가지 방법 가운데에서 먼저 3번 방법을 선택하였습니다. 3번을 선택한 이유는 6주 안에 서비스를 완성하는 것이 목표였기 때문이었습니다.

3번 방법으로 구현하게 되면 이미 사용하고 있는 미디어 서버를 활용할 수 있기 때문에 시간을 절약할 수 있고, 비디오 형태로 저장이 가능하기 때문에 다시보기 서비스를 구현하기에도 적합하다고 판단하여 3번 방법으로 구현을 시작하였습니다.

🌊 2. 미디어 스트림 형태로 전달하기