개발 공부/React

220609 [React] WebSocket과 socket.io

U_D 2022. 6. 9. 21:20

 

포트폴리오 프로젝트 내부에서 채팅 기능에 대한 피드백을 많이 받게되었다.원래는 카카오톡 그룹채팅방으로의 연결을 유도했지만, 사이트 내에서 해당 모임에 참여를 한 사람들만의채팅방이 있었으면 좋겠다는 의견이 있어 이력서를 제출하기 전에 socket 적용에 대해 고민을 해보았다.

먼저 socket이란 라이브러리가 그냥 하나로 있는 줄 알았는데 그게 아니라 개념 정리를 먼저 해본다.

 

WebSocket vs socket.io

웹소켓은 양방향 소통을 위한 프로토콜이다.

반면에, socket.io는 양방햔 통신을 하기위해 웹소켓 기술을 활용하는 라이브러리이다.

(마치 자바스크립트와 jQuery의 관계)

그렇기 때문에 socket.io가 같은 기능을 구현하더라도 약간 느리지만, 많은 편의성을 제공한다.

또한 Java, C++, Python 등 여러 언어들의 라이브러리 또한 지원된다.

 

 

WebSocket

  • HTML5 웹 표준 기술
  • 매우 빠르게 작동하며 통신할 때 아주 적은 데이터를 이용함
  • 이벤트를 단순히 듣고, 보내는 것만 가능함

Socket.io

  • 표준 기술이 아니며, 라이브러리임
  • 방 개념을 이용해 일부 클라이언트에게만 데이터를 전송하는 브로드캐스팅이 가능함

 

연결된 소켓(사용자)들을 세밀하게 관리해야하는 서비스인 경우에는 Broadcasting 기능이 있는 socket.io을 쓰는게 유지보수 측면에서 훨씬 이점이 많다. 반면 데이터 전송이 많은 경우에는 빠르고 비용이 적은 표준 WebSocket을 이용하는게 바람직하다. 

 

이후에는 백엔드 담당자와 함께 현재 프로젝트의 socket.io 적용을 진행해보려고 한다.