Slide 1

Slide 1 text

© LayerX Inc. vercel AI SDK のストリームと戯れる Suguru Namura - LayerX Web Frontend Night 2024-09-18

Slide 2

Slide 2 text

© LayerX Inc. 2 vercel AI SDK のストリームと戯れる でインストールできる LLM ⽤のパッケージ。vercel 製 https://sdk.vercel.ai/ AI SDK とは $ npm i ai OpenAI, Amazon Bedrock, Anthropic, Gemini など各種LLMに対応している Server Component, Server Action にも対応している ストリーム機能を持っている

Slide 3

Slide 3 text

vercel AI SDK の素敵なところ

Slide 4

Slide 4 text

4 © LayerX Inc. vercel AI SDK のストリームと戯れる generateText streamText generateObject streamObject LLM Abstraction Language Model Middlewares createStreamableValue createStreamableUI

Slide 5

Slide 5 text

5 © LayerX Inc. vercel AI SDK のストリームと戯れる generateText streamText generateObject streamObject LLM Abstraction Language Model Middlewares createStreamableValue createStreamableUI

Slide 6

Slide 6 text

6 © LayerX Inc. vercel AI SDK のストリームと戯れる 実はこの機能は、AI(LLM)と関係ない ストリーム機能 createStreamableValue createStreamableUI

Slide 7

Slide 7 text

Count Demo

Slide 8

Slide 8 text

8 © LayerX Inc. vercel AI SDK のストリームと戯れる createStreamableValue は汎⽤的 複数の Streamable Value を混ぜて返せる Server Action で使えて Async Iterable で受け取れる JSON が連続的な 状態である必要はない HTTP1.1で動作する Transfer-Encoding: chunked

Slide 9

Slide 9 text

Bulk Update Demo

Slide 10

Slide 10 text

おわり