반응형
최근 실시간 웹 애플리케이션의 중요성이 증가하면서, Spring의 WebFlux와 **Server-Sent Events(SSE)**가 많은 주목을 받고 있습니다. 이번 글에서는 WebFlux와 SSE의 특징과 사용 이유를 명확히 이해하고 장단점 및 실전 예제를 통해 알아보겠습니다.
📌 WebFlux와 SSE란?
- WebFlux
Spring의 리액티브 웹 프레임워크로, 비동기(Asynchronous), 논블로킹(Non-blocking) 방식의 요청 처리를 지원하여 동시성과 확장성을 극대화한 웹 애플리케이션을 개발할 수 있게 합니다. - Server-Sent Events(SSE)
클라이언트와 서버 간 단방향으로 실시간 이벤트 데이터를 전달할 수 있는 웹 표준 기술입니다. 주로 서버가 클라이언트로 계속해서 데이터를 실시간으로 보내는 환경에 적합합니다.
🚀 WebFlux SSE를 사용하는 이유
✅ 1. 실시간 데이터 스트리밍 지원
- 주식 시세, 뉴스 알림, 시스템 모니터링 등 데이터를 지속적이고 실시간으로 전달할 수 있습니다.
✅ 2. 비동기, 논블로킹 처리
- 많은 동시 접속자가 있더라도 적은 자원으로 효율적이고 빠르게 이벤트를 전달할 수 있습니다.
✅ 3. 경량 프로토콜 활용
- WebSocket 대비 프로토콜 자체가 단순하며, HTTP 표준만으로도 쉽게 구현할 수 있습니다.
✅ 4. 손쉬운 브라우저 호환성
- 별도의 플러그인이나 복잡한 설정 없이 HTML5를 지원하는 모든 브라우저에서 사용 가능합니다.
🎯 WebFlux SSE 예시 코드 (Spring Boot WebFlux)
💻 서버측 코드 예제 (Java)
import org.springframework.http.MediaType;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
import reactor.core.publisher.Flux;
import java.time.Duration;
@RestController
public class SSEController {
@GetMapping(value = "/stream-sse", produces = MediaType.TEXT_EVENT_STREAM_VALUE)
public Flux<String> streamEvents() {
// 1초 간격으로 클라이언트에 메시지 전송
return Flux.interval(Duration.ofSeconds(1))
.map(sequence -> "SSE Event - " + sequence);
}
}위 코드에서 Flux는 비동기 스트림으로, 서버가 클라이언트에 1초마다 지속적으로 이벤트를 전달하는 예시입니다.
🌐 클라이언트 측 JavaScript 코드 예시
<!DOCTYPE html>
<html>
<body>
<div id="events"></div>
<script>
const events = new EventSource('/stream-sse');
events.onmessage = (event) => {
document.getElementById("events").innerHTML += `<p>${event.data}</p>`;
};
events.onerror = () => {
console.error("Error occurred");
events.close();
};
</script>
</body>
</html>위의 코드에서 JavaScript의 EventSource를 사용하여 서버로부터 오는 SSE 데이터를 실시간으로 처리하고 웹 페이지에 표시합니다.
📈 WebFlux SSE의 장점과 단점
🔥 장점
- 빠른 성능 및 확장성
- 논블로킹 모델로 인해 다수의 동시 연결 처리 시 매우 효율적입니다.
- 쉬운 브라우저 지원
- 모든 최신 브라우저가 기본적으로 SSE를 지원하므로 별도의 호환성 처리 필요 없음.
- 리소스 효율성
- 별도의 풀링이나 연결 관리 복잡성이 없어서 서버 리소스 소모가 적습니다.
- 단순한 구현
- 웹소켓(WebSocket)에 비해 구현이 훨씬 간편하고 직관적입니다.
⚠️ 단점
- 단방향 통신 제한
- 클라이언트가 서버에 메시지를 보내는 기능이 없으며 단지 서버가 클라이언트로 보내는 데이터만 전달 가능.
- HTTP 프로토콜 제약
- HTTP 프로토콜 위에서 동작하므로 Header 크기 제한, 커넥션 타임아웃 관리 등 제약 사항 존재.
- 대규모 양방향 통신에는 부적합
- 양방향 상호작용이 필수적인 채팅이나 게임과 같은 애플리케이션에서는 WebSocket이 더 효율적입니다.
📊 SSE vs WebSocket 비교 간단 정리
| 항목 | SSE | WebSocket |
| 통신 방식 | 단방향 (서버→클라이언트) | 양방향(서버↔클라이언트) |
| 프로토콜 | HTTP | WebSocket 전용 프로토콜 |
| 연결 복잡성 | 간단하고 연결 유지 용이 | 상대적으로 복잡한 핸드셰이크 과정 |
| 브라우저 지원 | HTML5에서 바로 지원 | HTML5에서 지원 |
| 사용 분야 | 실시간 알림, 스트림 데이터 | 양방향 채팅, 게임, 실시간 협업 |
📍 WebFlux SSE를 언제 사용하면 좋을까?
- 실시간 알림 서비스 (채팅 알림, SNS 알림 등)
- 실시간 데이터 스트리밍 서비스 (주식 시세, 경기 실시간 스코어, 뉴스 피드)
- 실시간 모니터링 시스템 (서버 상태 체크, 실시간 분석 대시보드)
반면, 양방향 채팅이나 실시간 협업 도구 같은 경우라면 WebSocket을 고려하는 것이 더 효율적입니다.
🚩 결론 및 추천
- WebFlux의 SSE는 효율적이며 손쉬운 실시간 데이터 전달 방법을 제공합니다.
- 실시간 데이터를 지속적으로 클라이언트에게 전달할 필요가 있으며, 단방향 통신이면 SSE가 최적입니다.
- 양방향 통신이 필수적인 경우는 WebSocket 등 다른 솔루션을 선택하는 것이 좋습니다.
실제 서비스의 특성과 요구사항에 따라 WebFlux와 SSE 기술을 적절히 선택하여 최적의 성능을 얻으시길 바랍니다!
반응형
'Java > Basic' 카테고리의 다른 글
| 로깅 프레임워크 선택 (0) | 2025.03.25 |
|---|---|
| Spring vs. NestJS 상세 비교 (0) | 2025.03.24 |
| Filter(필터)란? (0) | 2025.03.24 |
| HttpServletResponse와 getOutputStream() 정리 (0) | 2025.03.24 |
| Java 11 vs 17 vs 21: 주요 변화와 코드로 살펴보기 (0) | 2025.03.24 |