refactor: Archive_Orphans 정리 및 Frontend/Backend/Architecture 분류 재배치 [2026-05-08]

10_Wiki/Topics/Programming & Language/스트림Stream.md

@@ -0,0 +1,34 @@
+---
+category: Computer_Science_and_Theory
+tags: [auto-wikified, technical-documentation, computer_science_and_theory]
+title: 스트림(Stream)
+description: "스트림(Stream)은 데이터를 한 번에 모두 전송하거나 기다리지 않고, 사용 가능한 시점마다 점진적으로 청크(Chunk) 단위로 전송하여 애플리케이션의 성능과 사용자 경험을 향상시키는 기법이다 [1, 2]."
+last_updated: 2026-05-04
+---
+
+# 스트림(Stream)
+
+## 📌 Brief Summary
+스트림(Stream)은 데이터를 한 번에 모두 전송하거나 기다리지 않고, 사용 가능한 시점마다 점진적으로 청크(Chunk) 단위로 전송하여 애플리케이션의 성능과 사용자 경험을 향상시키는 기법이다 [1, 2]. 프론트엔드 환경(특히 React 19 및 Next.js)에서는 서버 컴포넌트(RSC)와 결합하여 오래 걸리는 쿼리가 전체 페이지 렌더링을 차단하지 않도록 비순차적 스트리밍(Out-of-order streaming)을 구현하는 데 사용된다 [1, 3]. 백엔드 프레임워크인 NestJS나 Express.js 등에서는 인터셉터 파이프라인에서 RxJS 스트림을 활용하거나 복잡한 다중 실시간 데이터 스트림을 효율적으로 제어하는 데 활용된다 [4, 5].
+
+## 📖 Core Content
+*   **React Server Components (RSC)에서의 비순차적 스트리밍 (Out-of-order Streaming)**
+    *   React의 RSC 아키텍처는 모든 데이터를 기다렸다가 화면을 그리는 대신, 셸(Shell)과 같은 즉시 렌더링 가능한 부분을 먼저 클라이언트 측으로 전송한다 [2, 6].
+    *   일부 데이터 로드가 지연되더라도 준비된 HTML을 먼저 보내고, 느리게 로드되는 데이터는 서버에서 준비되는 대로 브라우저로 푸시(push)하는 비순차적 스트리밍을 지원한다 [1, 7].
+    *   이 과정에서 HTML 파일이 여러 청크로 나뉘어 스트리밍되므로, 브라우저는 자바스크립트나 무거운 스크립트 태그를 기다리지 않고도 UI를 신속하게 그릴 수 있다 [2].
+
+*   **Suspense와의 결합 및 페이로드 전송**
+    *   React Suspense와 스트리밍을 결합하면 RSC 페이로드가 클라이언트로 스트리밍되는 과정을 지능적으로 표시할 수 있다 [8]. 서버 컴포넌트가 아직 준비되지 않았다면 '로딩 중' 형태의 폴백(Fallback) 상태를 렌더링하고, 데이터를 가져오는 긴 쿼리 작업이 페이지 렌더링을 차단(Blocking)하지 않게 만든다 [3, 6, 8].
+    *   서버 컴포넌트에서 데이터 조회가 완료되면 해당 내용이 RSC 페이로드로 직렬화되어 클라이언트로 스트리밍되며, 이 과정에서 사용된 자바스크립트는 프론트엔드 번들에 추가되지 않는다 [9].
+
+*   **백엔드 프레임워크에서의 스트림 활용**
+    *   **NestJS (RxJS 스트림):** NestJS는 요청이 컨트롤러에 도달하기 전후에 실행되는 파이프라인 형태의 인터셉터(Interceptors)와 가드(Guards)를 제공한다 [5]. 이 컴포넌트들은 RxJS 스트림을 활용하여 비동기 작업을 유연하게 처리할 수 있도록 지원한다 [5].
+    *   **Express.js (실시간 데이터 스트림):** Express.js는 비동기 프로그래밍을 사용하여 다중 작업 처리에 능하며, 여러 수준의 데이터 스트림을 다뤄야 하는 복잡한 실시간 스트리밍 애플리케이션을 효율적으로 처리할 수 있는 프레임워크로 활용된다 [4, 10].
+
+## ⚖️ Trade-offs & Caveats
+*   **구조적 복잡성 증가 및 인간공학적 저하:** React Server Components와 스트리밍을 결합할 때, 클라이언트 컴포넌트와 서버 컴포넌트가 혼재되거나 컨텍스트가 중첩되는 페이지에서는 개발 복잡성이 크게 증가하여 React의 전체적인 인간공학적 측면(ergonomics)을 저하시킬 수 있다 [11]. 
+*   **페이로드 노출 및 보안(RCE) 위험:** 스트리밍되는 RSC 페이로드 구조는 브라우저의 네트워크 탭에서 누구나 볼 수 있으므로, 클라이언트 렌더링에 꼭 필요한 데이터만 전달하지 않으면 민감한 데이터가 노출될 수 있다 [12]. 또한, 서버 컴포넌트에서 클라이언트가 서버의 함수를 호출할 때 엄격한 유효성 검증을 거치지 않으면, 인증되지 않은 원격 코드 실행(CVE-2025-55182 등)과 같은 심각한 보안 취약점이 발생할 위험이 있다 [12-14].
+*   **아키텍처 강제성 부재로 인한 유지보수 제약 (Express.js):** 복잡한 데이터 스트림 처리에 유용한 Express.js는 자체적인 아키텍처 규칙을 강제하지 않으므로(Un-opinionated), 실시간 스트리밍 시스템과 같이 규모가 커지는 프로젝트에서는 개발자마다 비즈니스 로직과 라우팅을 배치하는 기준이 달라져 리팩토링과 유지보수가 혼란스러워질 수 있다 [15, 16].
+
+---
+*Last updated: 2026-05-03*