createStreamableUI — 서버에서 클라이언트로 UI를 스트리밍

createStreamableUI — 서버에서 클라이언트로 UI를 스트리밍

createStreamableUI는 서버에서 클라이언트로 UI를 보내는 스트림을 만드는 함수예요. 클라이언트 쪽에서는 일반적인 React 노드로 렌더링할 수 있어요. RSC(React Server Components) 기반의 AI SDK 기능 중 하나랍니다.

주의: AI SDK RSC는 현재 실험적(experimental)이에요. 프로덕션에서는 AI SDK UI를 사용하는 걸 권장해요. RSC에서 UI로 마이그레이션하는 방법은 마이그레이션 가이드를 참고하세요.

출처: 문서

본문

서버에서 클라이언트로 UI를 보내는 스트림을 만들어요. 클라이언트 쪽에서는 이를 일반 React 노드로 렌더링할 수 있어요.

Import

import { createStreamableUI } from "@ai-sdk/rsc"

API 시그니처

파라미터

  • initialValue: ReactNode — 스트리밍 UI의 초기값 (선택)

반환값

  • value: ReactNode — 스트리밍 UI의 값. Server Action에서 반환되어 클라이언트에서 받을 수 있어요.

메서드

  • update: (ReactNode) => void — 현재 UI 노드를 업데이트해요. 새 UI 노드를 받아 이전 노드를 대체해요.
  • append: (ReactNode) => void — 새 UI 노드를 이전 노드의 끝에 추가해요. 새 UI 노드를 추가한 뒤에는 이전 UI 노드를 더 이상 업데이트할 수 없어요.
  • done: (ReactNode | null) => void — UI 노드를 최종 확정하고 스트림을 닫아요. 호출한 뒤에는 UI 노드를 더 이상 업데이트하거나 추가할 수 없어요. 이 메서드는 항상 호출해야 하며, 그렇지 않으면 응답이 로딩 상태에 갇히게 돼요.
  • error: (Error) => void — UI 스트림에 에러가 있음을 알려요. 클라이언트 쪽에서 던져지며 가장 가까운 error boundary 컴포넌트에 잡혀요.

예시

더 알아보기 (Learn more)