Vercel AI SDK 6 : AI SDK RSC – 概要

by

React サーバ・コンポーネント (RSC) は、サーバ側でレンダリングされてクライアントにストリーミングされる UI を作成することを可能にします。RSC は、エンド-to-エンドの型安全性を備えた他の関数のように、クライアントからサーバ側コードを直接呼び出す新しい方法である、サーバ・アクションを有効にします。

Vercel AI SDK 6 : AI SDK RSC – 概要

作成 : Masashi Okumura (@classcat.com)
作成日時 : 02/21/2026
バージョン : ai@6.0.97

* 本記事は ai-sdk.dev/docs の以下のページを参考にしています :

* サンプルコードの動作確認はしておりますが、必要な場合には適宜、追加改変しています。
* ご自由にリンクを張って頂いてかまいませんが、sales-info@classcat.com までご一報いただけると嬉しいです。

 

クラスキャット AI 研究開発支援サービス ⭐️ 創立30周年（30th Anniversary）🎉💐

◆ クラスキャット は AI に関する各種サービスを提供しています。お気軽にご相談ください :

  • AI 研究開発支援 [詳細]

    1. AI エージェント構築支援
    2. 画像認識 (医療系含む) / 画像生成

  • AI 導入個別相談会(無償)実施中！ [詳細]

  • PoC(概念実証)を失敗させないための支援 [詳細]

◆ お問合せ : 下記までお願いします。

  • クラスキャット セールス・インフォメーション
  • sales-info@classcat.com
  • ClassCatJP

 

 

Vercel AI SDK 6.x : AI SDK RSC – 概要

⚠️ AI SDK RSC is currently experimental. We recommend using AI SDK UI for production.

React サーバ・コンポーネント (RSC) は、サーバ側でレンダリングされてクライアントにストリーミングされる UI を作成することを可能にします。RSC は、エンド-to-エンドの型安全性を備えた他の関数のように、クライアントからサーバ側コードを直接呼び出す新しい方法である、サーバ・アクションを有効にします。この組み合わせは、AI アプリケーションを構築する新しい方法への扉を開き、大規模言語モデル (LLM) が UI を生成して、サーバからクライアントに直接ストリーミングすることを可能にします。

 

AI SDK RSC 関数

AI SDK RSC は、React サーバ・コンポーネントを使用して AI ネイティブアプリケーションの構築を支援するように設計された様々な関数を含みます。これらの関数は :

  1. 生成型 UI アプリケーションを構築するための抽象化の提供。

    • streamUI : モデルを呼び出し、React サーバコンポーネントで応答できるようにします。

    • useUIState : 現在の UI 状態と、(React の useState のように) UI 状態を更新する関数を返します。UI 状態は AI 状態の視覚表現です。

    • useAIState : 現在の AI 状態と、(React の useState のように) AI 状態を更新する関数を返します。AI 状態は、(システムメッセージ、関数のレスポンス、その他の関連データのような) AI モデルと共有されるコンテキストと情報を含むことを目的としています。

    • useActions : クライアントからサーバアクションへのアクセスを提供します。サーバとのユーザ・インタラクションを必要とするインターフェイスを構築するために特に有用です。

    • createAI : アプリケーション・ツリーの一部をラップして、アプリケーションの UI と AI の両方の状態を簡単に管理するために使用できる、クライアント-サーバ・コンテキストプロバイダーを作成します。

  2. サーバとクライアント間のストリーミング可能な値の操作の単純化。

    • createStreamableValue : サーバからクライアントに値を送信するストリームを作成します。値は任意のシリアライズ可能なデータです。

    • readStreamableValue : createStreamableValue を使用して最初に作成されたストリーミング可能な値をクライアントから読み取ります。

    • createStreamableUI : サーバからクライアントに UI を送信するストリームを作成します。

    • useStreamableValue : createStreamableValue を使用して作成されたストリーミング可能な値を受け取り、現在の値、エラー、保留状態を返します。

 

以上