[Dev-Fortune] 시리즈 다시보기
1. 서론: AI 답변, 왜 기다리게 하나요?
사용자 경험(UX)을 위해 한 글자씩 타이핑하듯 보여주는 스트리밍 방식은 필수적입니다. 우리 프로젝트는 WebFlux와 **SSE(Server-Sent Events)**를 활용했습니다.
2. 스트리밍 시퀀스 다이어그램
서버와 클라이언트 간의 끊임없는 데이터 흐름을 살펴보세요.
sequenceDiagram
participant U as User
participant S as Spring Server (Flux)
participant A as AI Model (Ollama)
U->>S: POST /chat (Request)
Note over S,A: Connection Stay Open
A-->>S: "오늘의" (Token 1)
S-->>U: data: "오늘의"
A-->>S: " 사주는" (Token 2)
S-->>U: data: " 사주는"
Note right of U: 사용자는 실시간으로 글자가 보임
3. Flux와 SSE
MediaType.TEXT_EVENT_STREAM_VALUE를 사용하여 AI가 단어(Token)를 생성할 때마다 즉시 클라이언트로 전송합니다. 비차단(Non-blocking) 방식인 WebFlux는 답변을 기다리는 동안 쓰레드를 점유하지 않아 성능적으로도 우수합니다.
4. 클라이언트에서의 처리
프론트엔드에서는 fetch API의 getReader()를 사용하여 한 글자씩 화면에 덧붙이는 작업을 수행합니다.
다음 6편에서는 지금까지의 기술들을 하나로 묶어 전체 워크플로우를 심층 분석해 보겠습니다.