N개의 탭, 단 하나의 웹소켓: SharedWorker
구현의 기초가 된 학습 자료
풍물 커뮤니티 프로젝트에서 실시간 채팅 기능을 구현할 때, 처음에는 각 페이지마다 같은 주소에 대한 웹소켓 요청을 따로 보내고 구독 요청을 하는 방식으로 개발했다. 하지만 토스 SLASH 24 컨퍼런스에서 “N개의 탭, 단 하나의 웹소켓: SharedWorker” 세션을 보면서새로운 사실을 발견했다. Service Worker를 통해서 하나의 웹소켓에 대해서 다중으로 연결할 수 있다는 것이었다.
더욱 흥미로운 것은 Shared Worker를 지원하는 브라우저에서는 여러 탭 간에도 웹소켓 연결을 공유할 수 있다는 사실이었다. 이전에는 각 탭마다 별도의 웹소켓 연결을 생성하는 것이 당연하다고 생각했는데, 실제로는 중앙화된 웹소켓 관리가 가능하다는 것을 알게 되었다. 이 개념을 직접 적용해보기로 했다.
핵심적인 부분은 아래와 같았다.