#realtime
노트 9개
Frontend › Web
브라우저 실시간 통신: 롱 폴링, SSE, WebSocket 클라이언트서버가 먼저 보내는 데이터를 브라우저에서 받는 세 가지 방법의 클라이언트 쪽 구현을 정리한다. 재요청 루프로 만드는 롱 폴링, HTTP 위의 텍스트 스트림인 SSE(EventSource의 메시지 형식·자동 재연결·Last-Event-ID와 fetch로 직접 읽는 방법), 그리고 WebSocket API의 바이너리·버퍼·종료 코드·재연결까지.
Backend › Architecture
뉴스 피드 설계: 연결, 활동, 팬아웃뉴스 피드는 「누구와 연결됐나」와 「누가 무엇을 했나」 두 데이터를 합쳐 사용자마다 다른 목록을 만드는 문제다. 읽을 때 모으는 방식(스캐터·개더)과 쓸 때 받은편지함에 뿌리는 방식(팬아웃)의 차이, 활동 복제와 집계·중복 제거·점수 매기기, 비정규화와 캐시로 타임라인을 빠르게 만드는 법을 정리했다.
Backend › Architecture
멀티플레이 게임 서버 설계: 턴제 비동기와 실시간온라인 멀티플레이 게임을 두 갈래로 정리했다. 턴제 비동기 게임은 게임 상태를 DB에 저장하고 차례가 오면 푸시로 알리며, 상태를 격자 문자열이나 명령 로그로 표현한다. 실시간 게임은 서버가 상태의 권위를 갖고, 클라이언트는 입력 예측·서버 보정·보간으로 지연을 숨긴다.
Backend › Architecture
실시간 공동 편집: OT와 CRDT구글 문서처럼 여럿이 동시에 고치는 편집기는 편집을 문서 전체가 아니라 연산(삽입·삭제) 단위로 WebSocket으로 주고받고, 동시에 일어난 연산을 충돌 없이 합치는 알고리즘이 핵심이다. 중앙 서버가 연산을 변환하는 OT, 연산 자체를 교환·결합 가능하게 만든 CRDT, 차이를 주고받는 차등 동기화가 있다.
Backend › Architecture
실시간 트렌딩과 Top-K 집계최근 시간 창에서 가장 많이 언급된 상위 K개를 구하는 문제를 정리했다. 슬롯 링 버퍼로 만드는 슬라이딩 창 카운터, 키별 카운트 → 부분 순위 → 전역 순위의 3단 집계, 창이 밀릴 때 다시 계산하지 않는 최소 후보 집합(MinTopk), 키가 너무 많을 때의 근사 Top-K, 과거 패턴과의 거리로 트렌드를 일찍 잡는 비모수 방법까지 다룬다.
Backend › Architecture
채팅 시스템 설계: 연결, 접속 상태, 메시지 전달채팅 서버는 클라이언트와 WebSocket을 유지하고, 메시지는 순서를 매겨 저장한 뒤 받는 사람이 붙어 있는 서버로 전달한다. 서버가 여러 대이면 Redis pub/sub·메시지 큐로 서버 간에 메시지를 넘기고, 접속 상태 서비스가 온라인이면 소켓으로, 오프라인이면 푸시 알림으로 보낸다.
Backend › Web Basics
웹훅과 폴링다른 서비스의 변화를 알아내는 두 방법. 폴링은 내가 주기적으로 묻고, 웹훅은 상대가 이벤트가 생길 때 내 엔드포인트를 호출한다. 동작 흐름과 장단점, 고르는 기준, 웹훅을 받는 쪽이 갖춰야 할 서명 검증·빠른 응답·멱등 처리·재시도 대비를 정리했다.
Computer Science › Network
WebRTC브라우저와 앱이 서버를 거치지 않고 오디오·비디오·데이터를 실시간으로 주고받게 하는 WebRTC의 API, 시그널링, ICE/STUN/TURN, 연결 흐름.
Computer Science › Network
WebSocket한 번 맺은 연결로 서버와 브라우저가 양방향 실시간 통신을 하는 WebSocket. OS 소켓과의 차이, HTTP Upgrade 핸드셰이크와 버전, 프레임과 텍스트·바이너리, ping/pong, 압축 확장, 폴링·SSE·HTTP/2와의 비교, 보안과 인증, 로드 밸런싱·프록시·우아한 종료, 라이브러리 선택과 디버깅을 정리한다.