목표
실시간 알림 서비스를 구현하고자, 어떤 방식이 알림 서비스에 적합한지 알아보고, 실시간 통신 방식에 대해서 학습한다.
ShortPolling
특징
- 클라이언트는 일정한 간격(예:1~2초) 으로 HTTP요청을 계속해서 보내는 방법
- 서버에서 업데이트가 없을 경우, 대부분의 요청은 빈응답으로 받는다.
단점
- 높은 HTTP 오버헤드가 발생한다.
- 불필요한 네트워크 호출이 발생한다.
- 실시간 통신 애플리케이션으로 적합하지 않다.
HTTP 오버헤드란?
- 네트워크를 통해 대상으로 라우팅되는 데이터와 함께 전송되어야하는 정보를 말하며, 올바른 대상에 도달하기 위해
전송중인 데이터에 추가로 보내지는 정보라 보면 된다.
장점
- 정보 전송의 신뢰성을 높일 수 있고 시스템을 안정적으로 운용할 수 있다.
단점
- 작은 정보라도 TPS(전송시간)가 늘어나게 되는데, 거기서 HTTP 오버헤드가 발생한다.
LongPolling
특징
- 클라이언트는 서버가 응답을 제공할 때까지 기다린다.
- 서버가 응답을 보내거나 시간 초과가 발생할 때까지 연결이 열려있는다.
- HTTP 오버헤드가 낮다.
단점
- 채팅 애플리케이션에는 비효율적이다.
- 사용자가 채팅을 많이 하지 않는 경우에도 긴 폴링은 시간 초과 후에도 정기적인 연결을 한다.
WebSocket
특징
- 클라이언트와 서버 간의 지속적인 연결이다.
- 단일 TCP/IP 소켓 연결을 통해 HTTP를 통해 작동하는 양방향 전이중 통신 채널을 제공한다.
- 클라이언트와 서버 간의 메시지 전달에 용이하다.
장점
1. 빠른 반응 시간
- 빠르게 반응하기 때문에, 실시간 데이터 전송에 용이하다.
- 보내고 받는 각 메시지에 대해 HTTP 요청/응답 오버헤드가 필요하지 않기 때문에 REST에 비해 효율성이 더 높다.
- 처음에 한번만 핸드셰이킹을 수행하므로 통신 오버헤드가 낮다.
핸드셰이킹이란?
- 통신의 양측 간에 조건에 합의해가는 정보 교환 과정에 붙이는 용어이다.
- 데이터를 전송할 때에, 두 장치 간에 동기(同期)를 맞추기 위하여 일련의 신호를 주고받는 행위이다.
2. 지속적인 업데이트
- 클라이언트가 언제 변경이 발생할지 예측할 수 없고 단기간에 변경이 발생할 가능성이 있는 경우 적합하다.
3. 임시 메시징
- 메시지는 언제든지 연결의 양쪽 끝에서 전송될 수 으며, 한 메시지가 다른 메시지와 관련되어 있음을 나타내는 기본 지원은 없기 때문에, "실행 후 잊어버리는" 메시징 시나리오에 적합하다.
4. 비용
- 개별 메시지에는 전송을 설정하기 위한 추가 비용이 발생하지 않는다.
단점
- 기능을 사용하려면 동일한 서비스에 대해 동시에 여러 WebSocket을 열어야 한다.
- 연결이 매우 적거나, 짧은 시간 동안 사용될 경우 이벤트에 빠르게 반응할 필요가 없기 때문에 불필요하다.
- SSL 설정, 콘텐츠 협상, 대용량 헤더 교환 등의 비용은 연결이 설정될 때 부과되며, 연결을 유지하는 것 자체가 비용이 많이 부과된다.
- 트래픽 양이 많은 서버의 경우 CPU에 큰 부담이 될 수 있다.
SSE(Sever-Sent Events)
특징
- HTTP 스트리밍을 통해 클라이언트가 서버로부터 자동 업데이트를 받을 수 있도록하는 서버 푸시 기술이다.
- 서버에서 클라이언트로 흐르는 단방향 통신 기술이다.
장점
- 웹소켓의 경우, 서버와 클라이언트 간의 연결을 유지시켜야하지만, http 연결만 되어 있으면, 클라이언트 요청없이도 서버에서 클라이언트로 데이터를 보낼 수 있다.
- 별도의 복잡한 기술 없이, HTTP 프로토콜을 기반으로 서버에서 클라이언트로 Real-Time Push Notification을 전송할 수 있다.
- 서버는 연결이 되면, 클라이언트의 요청 없이 서버에서 클라이언트로 데이터를 계속해서 보낼 수 있다.
- 오버헤드가 낮다.
단점
- 클라이언트에서는 서버로 데이터를 보낼 수 없다.
참고 링크
https://medium.com/techieahead/http-short-vs-long-polling-vs-websockets-vs-sse-8d9e962b2ba8
https://inpa.tistory.com/entry/WEB-%F0%9F%93%9A-HTTP-Overhead-%EB%9E%80
'개발 공부' 카테고리의 다른 글
[React] useEffect()를 제거해보자! (1) | 2023.11.26 |
---|---|
개발 버전 관리 (1) | 2023.10.17 |
[리액트 공식 문서] Reducer와 Context로 확장하기 (0) | 2023.09.06 |
[리액트 공식 문서] context로 데이터 깊숙이 전달하기 (0) | 2023.09.06 |
[리액트 공식 문서] state 로직을 reducer로 추출하기 (0) | 2023.09.06 |