지금 이순간, 재고는 줄고 있다 실시간 UI 경험을 위한 SSE 여정
if kakao 카카오 · YouTube
AI 핵심 요약
선물하기의 한정 수량 상품에서 재고와 타이머 정보가 늦게 반영되는 문제를 해결하기 위해, 폴링 대신 단방향 푸시에 적합한 SSE를 도입했습니다. 서버는 Spring WebFlux의 `ServerSentEvent`와 Reactor Sink로 이벤트를 전달하고, Redis Pub/Sub를 통해 재고 변경을 구독하도록 구성했습니다. 이벤트 발행 부담을 줄이기 위해 MongoDB Change Streams로 변경을 감지하고 짧은 시간 동안 발생한 이벤트를 샘플링했으며, Angular에서는 EventSource를 RxJS Observable과 Signals에 연결해 UI에 반영했습니다. 발표에서는 부하 테스트에서 SSE가 폴링보다 약 2.8배 많은 트래픽을 처리했고, 동시 접속자가 10만 명을 넘은 날에도 CPU 사용량을 15% 수준으로 유지했다고 소개하며, 연결 수와 이벤트 빈도를 함께 관리해야 한다는 점을 강조했습니다.
- 양방향 통신이 필요하지 않고 서버에서 클라이언트로만 데이터를 보내는 경우에는 WebSocket보다 SSE가 단순한 선택이 될 수 있습니다.
- 브라우저 EventSource는 자동 재연결을 지원하지만 요청 헤더를 직접 설정할 수 없으므로 인증 방식과 연결 수 제한을 미리 고려해야 합니다.
- Angular에서는 EventSource 콜백을 RxJS Observable로 감싸고 Signal로 연결하면 스트림 데이터를 UI 반응형 구조에 통합할 수 있습니다.
- SSE 서버 부하는 활성 연결 수뿐 아니라 이벤트 발행 속도에도 좌우되므로, MongoDB Change Streams와 샘플링으로 중복·과잉 이벤트를 줄일 수 있습니다.
- 장시간 연결을 운영할 때는 프록시 타임아웃과 버퍼링 설정, 연결 수명 및 재연결 정책을 함께 점검해야 합니다.
소개
if(kakao)25 선물하기 서비스는 기존 폴링 방식의 한계를 넘어섰습니다. Spring WebFlux·Redis Pub/Sub 기반 SSE와 Angular RxJS·Signals를 활용한 실시간 UI 구조 전환 사례를 공유합니다. #TECH #PRODUCT #Backend #Frontend 카카오 커머스에서 나에게 선물하기 서버개발을 담당하고 있는 임동현(kai.do)입니다. 카카오 커머스에서 나에게 선물하기 프론트개발을 담당하고 있는 김민우(max.pro)입니다. 발표자료 보기 📍 https://if.kakao.com/2025/session?sessionId=26 📍 if.kakao.com if(kakao)25 홈페이지 : https://if.kakao.com/2025 #카카오 #kakao #이프카카오25
비슷한 학습 자료
컨퍼런스 if kakao
커뮤니티로 진화한 오픈채팅, AI로 슬기롭게 연결하다
컨퍼런스 if kakao
if(kakao)25 더 많은 사용자를 만나기 위한 오픈채팅의 변화, 새로운 커뮤니티를 소개합니다. (발표자: 김초은) 커뮤니티 콘텐츠 추천 AI 기술: 아무것도 없는 곳에서 길 찾기 (발표자: 김선범) #PRODUCT #TECH #Community #AI 카카오에서 오픈채팅 제품 기획, 운영을 담당하고 있는 김초은(chelsea.kim)입니다. 카카오에서 AI 추천 기술 연구 및 개발을 담당하고 있는 김선범(jeffrey.1002)입니다. 발표자료 보기 📍 https://if.kakao.com/2025/session?sessionId=11 📍 if.kakao.com if(kakao)25 홈페이지 : https://if.kakao.com/2025 #카카오 #kakao #이프카카오25
딥러닝 · 머신러닝 프로덕트 지표 · 실험
컨퍼런스 if kakao
복잡한 흐름 앞에서, 우리가 선택한 건 Funnel / 이었다
컨퍼런스 if kakao
if(kakao)25 복잡한 동선을 가진 웹뷰 서비스에서, 기획자와 개발자가 동일한 흐름을 바라볼 수 있도록 퍼널 중심의 구조화를 설계하고 useFlow로 구현한 경험을 소개합니다. #TECH #Frontend 카카오 비즈니스에서 FE를 담당있는 차재명(max.cha)입니다. 반복되는 불편을 줄이고, 개발자 경험과 팀이 몰입할 수 있는 환경을 만드는 데 관심이 많습니다. 발표자료 보기 📍https://if.kakao.com/2025/session?sessionId=39 if(kakao)25 홈페이지 : https://if.kakao.com/2025 #카카오 #kakao #이프카카오25
프론트엔드
컨퍼런스 if kakao
사용자 발화에서 응답까지: 그래프 기반 에이전트로 동작하는 AI 서비스
컨퍼런스 if kakao
if(kakao)25 사용자 발화에서 응답까지의 과정을 그래프 기반 에이전트 구조로 풀어낸 카카오의 AI 서비스 구현 방식을 공유합니다. #TECH #PRODUCT #LLM #Agent 카카오에서 LLM을 활용해 여러 도메인의 AI서비스를 개발하고 있는 홍보미(chloe.bm)입니다. AI 서비스의 홍수 속에서 빠지지 않도록 열심히 헤엄치고 있습니다. 카카오에서 LLM을 활용해 여러 도메인의 AI서비스를 개발하고 있는 길민호(ethan.mino)입니다. 스트리밍과 안정적인 LLM 서빙에 관심이 있습니다. 발표자료 보기 📍https://if.kakao.com/2025/session?sessionId=34 📍if.kakao.com if(kakao)25 홈페이지 : https://if.kakao.com/2025 #카카오 #kakao #이프카카오25
AI에이전트 개발
컨퍼런스 if kakao
카카오 커머스 마케팅의 진화: AI, CRM을 만나다
컨퍼런스 if kakao
if(kakao)25 마케팅의 전 과정을 관리하며 실험을 통해 성과를 극대화하는 플랫폼, Air-CRM을 소개합니다. 데이터와 AI의 잠재력을 비즈니스 성장으로 이끄는 Air-CRM, 그 로드맵을 공유합니다. #TECH #PRODUCT #Data #AI 커머스 커머스에서 Air-CRM 기술기획/개발을 담당하고 있는 국정우(ethan.kay)입니다. 카카오커머스에서 마케팅 플랫폼 Air-CRM을 만들고 운영하고 있는 최란(ellie.ran)입니다. 발표자료 보기 📍 https://if.kakao.com/2025/session?sessionId=17 📍 if.kakao.com if(kakao)25 홈페이지 : https://if.kakao.com/2025 #카카오 #kakao #이프카카오25
AI에이전트 개발 프로덕트 지표 · 실험
컨퍼런스 if kakao
Preview Backend_1 @if(kakao)2022
컨퍼런스 if kakao
if(kakao)2022 컨퍼런스에서 Backend_1 관련 기술 발표 트랙을 소개합니다. 03:02 1. API 테스트 주도 개발의 시작 by 공진산(ronaldo.c) 카카오 테스트플랫폼셀에서 개발을 하고 있는 호날두입니다. 03:38 2.대량의 광고 데이터 필터 기능 개발기: ES한테 뺨맞고 Citus한테 안긴 썰 by 이동준(genos.lee) 카카오 crux개발2셀에서 서버 개발을 담당하고 있는 제노스라고 합니다. 04:17 3.Docker Swarm 기반 Redis SaaS 플랫폼 구축사례 by 이은미(silvia.lee) 카카오 시스템엔지니어와 레디스 플랫폼 엔지니어를 맡고있는 실비아입니다. 04:48 4. 카카오톡 메시징 시스템 재건축 이야기: C++ 서버를 Java및 Kotlin으로 by 남기영(sirius.nam) 카카오톡 메시징 시스템을 개발 및 운영하는 시리우스 입니다. 05:10 5. 카카오톡 메시징 지표 이상감지 시스템의 개선사례 by 김예솔(so...
백엔드 데이터베이스 소프트웨어 테스트
컨퍼런스 if kakao
Preview Web+Mobile @if(kakao)2021
컨퍼런스 if kakao
if (kakao) 2021 컨퍼런스에서 Data 관련 기술 발표 세션을 소개합니다. 1. 이게 진짜 일 리 없어 : 초보 리더가 프로젝트에서 마주치는 어려운 상황들 @effie.seo 올해 6월에 카카오맵 매장관리 서비스를 오픈했습니다. 매장관리 프로젝트 진행 과정을 통해서 카카오맵 FrontEnd 개발자들은 어떻게 협업하는지, 프로젝트에서 마주쳤던 상황들을 대처 하기 위해서 초보 리더인 제가 동료들과 함께 고민하고 시도했던 과정에 대해서 공유해보고자 합니다 2. Next.js와 Typescript를 이용한 프론트엔드 개발기 @jaden.js @luffy.yeon Next.js를 사용한 서버사이드 랜더링, Next.js 환경 Typescript 포팅을 하며 겪은 경험 공유 3. 톡패스워드 크롬 익스텐션 개발기 @felix.lee 입사 후 처음으로 혼자 프로젝트를 설계하면서 고민했던 구조선택과 고민거리에 대한 공유 4. UI 테스트 경험기 @jay.choi 리팩토링에 대한...
프론트엔드 소프트웨어 테스트 애자일 · 협업