

1. 서버리스 환경에서의 채팅 구현 경험
이전에 채팅 기능을 구현할 때, 서버리스 환경에서 작업을 했었다.
사실 이런 환경에서 개발할 일이 많지는 않지만, 그 덕분에 풀링(Polling) 이라는 개념을 알게 되었다.
당시에는 웹소켓을 제대로 다룰 수 없어서 풀링 방식으로 채팅을 구현했는데,
아무래도 완성도 면에서 아쉬움이 남았다.
그래서 이번 기회에 웹소켓의 개념부터 실제 동작 방식까지 다시 정리해보기로 했다.
2. 웹소켓이란?
웹소켓은 클라이언트(브라우저)와 서버 간에 지속적인 연결 상태를 유지한 채,
양방향으로 데이터를 주고받을 수 있는 프로토콜이다.
기존 HTTP는 요청을 보내야 응답이 오는 구조지만,
웹소켓은 한 번 연결을 맺으면 서버와 클라이언트가 자유롭게 실시간 통신할 수 있다.
3. 웹소켓이 등장하게 된 이유
초기 웹은 단순히 정적인 HTML 페이지를 보여주는 용도로 사용됐다.
즉, 사용자가 요청하면 서버가 응답하는 구조만으로도 충분했다.
하지만 시간이 지나면서 웹은 점점 실시간성을 요구하는 서비스로 발전하게 된다.
예를 들어:
- 코인/주식 거래소의 가격 변동
- 채팅 기능
- 댓글 알림
- 스포츠 중계
이처럼 정보가 실시간으로 변하고, 즉시 반영되어야 하는 상황들이 생긴 것이다.
4. 풀링(Polling) 방식의 이해와 한계
이런 요구를 맞추기 위해 등장한 방식이 풀링(Polling) 이다.
클라이언트가 주기적으로 서버에 “새로운 데이터가 있나요?”라고 물어보는 방식이다.
하지만 이 방식은 응답이 없어도 계속 요청을 보내야 하므로 매우 비효율적이다.
서버는 바빠지고, 네트워크 트래픽도 낭비된다.
이를 조금 개선한 방식이 롱 폴링(Long Polling) 인데,
이 역시 연결을 매번 새로 맺어야 한다는 구조적 한계를 벗어나지 못했다.
5. 웹소켓은 정말 모든 통신에 적합할까?
처음에는 나도 의문이 들었다.
“웹소켓이 그렇게 좋으면, 왜 HTTP 요청을 여전히 쓰는 걸까?”
하지만 알고 나니, 정말 바보 같은 질문이었다.
그 이유는 간단하다.
웹소켓은 연결을 유지하는 데 자원이 많이 들기 때문이다.
HTTP 요청은 요청 후 바로 끊기기 때문에 서버 입장에서 부담이 적다.
반면 웹소켓은 지속적인 연결 상태를 관리해야 하며,
사용자가 많을수록 서버 리소스가 기하급수적으로 소모된다.
그래서 실시간성이 필요하지 않은 대부분의 기능은 여전히 HTTP 방식이 훨씬 효율적이다.
6. 웹소켓이 적합한 상황은 언제일까?
결국 웹소켓은 “지금 이 순간의 정보가 바로 보여야 할 때”,
즉 실시간성이 중요한 상황에서만 진가를 발휘한다.
예를 들어:
- 채팅 메시지를 바로 보여줘야 할 때
- 알림이 즉시 떠야 할 때
- 실시간으로 변하는 주식 가격을 반영해야 할 때
반대로, 유저 프로필 조회나 게시글 목록 같은 데이터는
그냥 HTTP 요청으로도 충분하다. 오히려 그게 더 간단하고 안정적이다.
그래서 대부분의 서비스는
웹소켓 + REST API를 적절히 혼합해서 사용한다.
7. 웹소켓은 어떻게 연결되고 동작할까?
처음엔 나도 “웹소켓은 그냥 연결하면 되는 거 아닌가?”라고 생각했다.
하지만 실제로는 HTTP → WebSocket으로 바뀌는 특별한 과정이 필요하다.
이걸 핸드셰이크(Handshake) 라고 부른다.
- 브라우저는 처음에 HTTP 요청을 보낸다
- 요청 헤더에 Upgrade: websocket이라는 정보를 포함해 보낸다
- 서버가 이를 승인하면, 응답으로 101 Switching Protocols을 보내고
- 그 순간부터 웹소켓 연결이 성립된다
이후에는 클라이언트와 서버가 서로 자유롭게 메시지를 주고받을 수 있다.
메시지는 주로 JSON 형식으로 주고받고, 필요하면 바이너리 데이터도 가능하다.
8. 마무리: 실시간성과 안정성의 균형
웹소켓은 정말 멋진 기술이라는 생각이 들었다.
하지만 실시간성과 안정성, 효율성 사이의 균형이 필요한 기술이기도 하다.
무조건 웹소켓을 쓰는 것보다, “어떤 통신이 실시간성을 필요로 하는지”를 먼저 고민하는 태도가 더 중요한 것 같다.
그 의문에서 부터 풀링을 배우기도 했고, 웹소켓까지 배울 수 있었기 때문이다.
일단 웹 소켓이 등장하게된 전반적인 배경과 어떻게 동작을 하는지 알아봤으니, 이걸 기반으로 채팅도 구현해서 지난번 구현보다 좀 더 나은 형태의 채팅을 구현해보겠다.
'Front-End > 프론트엔드 개념 정리' 카테고리의 다른 글
React는 왜 등장했을까? (1) | 2025.06.18 |
---|---|
var, let, const의 차이점 (2) | 2025.02.19 |
HTTP 메서드란? (8) | 2024.10.05 |
프론트엔드 공부 기록 및 나의 성장기
포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!