Skip to content
roguelite labsAnthony Spezzano ↗

Vercel AI SDK

2 min · tool

The Vercel AI SDK (package: ai) is a TypeScript library that provides a unified interface for calling LLM providers, with first-class support for streaming in React, Next.js, and Node.js. It abstracts provider-specific APIs behind a consistent set of functions so switching providers or supporting multiple ones doesn't require rewriting application logic.

Core APIs

generateText — single-turn text generation. Returns the full response when generation is complete. Use for non-streaming tasks: classification, extraction, background jobs.

streamText — streaming text generation. Returns an async iterator of text chunks. Designed for UI use cases where you want to display output progressively.

generateObject — structured output generation. Takes a Zod schema, returns a typed object. Internally uses tool-use or JSON mode depending on the provider. The cleanest way to get typed structured data out of a model in TypeScript.

import { generateObject, streamText } from 'ai';
import { anthropic } from '@ai-sdk/anthropic';
import { z } from 'zod';

// Structured output
const { object } = await generateObject({
  model: anthropic('claude-opus-4-5'),
  schema: z.object({
    sentiment: z.enum(['positive', 'negative', 'neutral']),
    confidence: z.number().min(0).max(1),
    summary: z.string()
  }),
  prompt: 'Analyze the sentiment of this review: "Excellent product, fast shipping."'
});
// object.sentiment → 'positive'

// Streaming
const result = streamText({
  model: anthropic('claude-opus-4-5'),
  prompt: 'Explain transformer attention in plain English.'
});

for await (const chunk of result.textStream) {
  process.stdout.write(chunk);
}

Provider Support

Provider packages follow the pattern @ai-sdk/<provider>:

  • @ai-sdk/anthropic — Claude models
  • @ai-sdk/openai — GPT and o-series models
  • @ai-sdk/google — Gemini models
  • @ai-sdk/mistral, @ai-sdk/cohere, others

Switch providers by swapping the model import. The function signatures and return shapes are identical across providers.

Next.js Streaming Integration

The SDK integrates with Next.js App Router's streaming conventions. Server components and route handlers can stream model responses directly to the client without managing SSE or chunked transfer encoding manually.

// app/api/chat/route.ts
import { streamText } from 'ai';
import { anthropic } from '@ai-sdk/anthropic';

export async function POST(req: Request) {
  const { messages } = await req.json();
  const result = streamText({
    model: anthropic('claude-sonnet-4-5'),
    messages
  });
  return result.toDataStreamResponse();
}

On the client, useChat from ai/react handles the streaming state, message history, and loading states.

When to Use vs. Direct Anthropic SDK

Use the Vercel AI SDK when:

  • Building in Next.js or another React framework where streaming UI is a requirement
  • Supporting multiple providers (model routing, fallback, A/B testing)
  • You want TypeScript-first structured outputs via generateObject

Use the direct Anthropic SDK when:

  • You need access to Anthropic-specific features not yet abstracted by the AI SDK (extended thinking, specific tool behaviors, prompt caching headers)
  • Building in Python
  • Server-side only usage with no framework streaming requirements

The two are composable: you can use @ai-sdk/anthropic for most requests and drop down to @anthropic-ai/sdk directly for features the abstraction doesn't cover.

tool-use

Sources