ai

AI SDK by Vercel - The AI Toolkit for TypeScript and JavaScript

weekly downloads7.4M

versionv6.0.94

licenseApache-2.0

categoryai

aivercelsdkmcptool-callingtoolsstructured-outputagentagenticgenerativechatbotpromptinferencellmlanguage-modelstreaming

Overview

The 'ai' package is Vercel's AI SDK, a TypeScript-first toolkit designed to simplify building AI-powered applications in JavaScript environments. It provides a unified, provider-agnostic interface for working with large language models from OpenAI, Anthropic, Google, and other providers. Instead of learning different APIs for each provider, developers use consistent methods like generateText() and streamText() that work across all supported models.

The SDK emerged from Vercel's need to standardize AI integration patterns in modern web frameworks, particularly for streaming responses in edge runtimes and server components. It abstracts away the complexity of handling streaming tokens, managing conversation state, and implementing tool calling (function execution). With over 7 million weekly downloads, it's become a standard choice for production AI features in Next.js applications and beyond.

The package is split into modular components: the core 'ai' package for streaming and UI integration, provider packages like '@ai-sdk/openai' for model access, and framework-specific bindings. It requires Node.js 18+ and works in serverless/edge environments. Developers can switch from one model provider to another by changing a single function call, making it trivial to compare models or implement fallback strategies without rewriting application logic.

Quick Start

typescript

import { streamText } from 'ai';
import { openai } from '@ai-sdk/openai';

// Server-side streaming text generation
export async function POST(req: Request) {
  const { messages } = await req.json();

  const result = streamText({
    model: openai('gpt-4-turbo'),
    messages,
    system: 'You are a helpful assistant that provides concise answers.',
    maxTokens: 500,
    temperature: 0.7,
    tools: {
      getWeather: {
        description: 'Get current weather for a location',
        parameters: z.object({
          location: z.string().describe('City name')
        }),
        execute: async ({ location }) => {
          return { temp: 72, condition: 'sunny', location };
        }
      }
    }
  });

  return result.toDataStreamResponse();
}

// Client-side React hook usage
import { useChat } from 'ai/react';

export default function Chat() {
  const { messages, input, handleInputChange, handleSubmit } = useChat({
    api: '/api/chat'
  });

  return (
    <div>
      {messages.map(m => (
        <div key={m.id}>
          <strong>{m.role}:</strong> {m.content}
        </div>
      ))}
      <form onSubmit={handleSubmit}>
        <input value={input} onChange={handleInputChange} />
        <button type="submit">Send</button>
      </form>
    </div>
  );
}

Use Cases

Real-time chatbots: Build conversational interfaces with streaming responses that render tokens as they arrive, improving perceived performance. The useChat() hook manages message history and UI state automatically.

Structured data extraction: Use generateObject() with Zod schemas to parse unstructured text into typed TypeScript objects, ideal for extracting contact information from emails or parsing receipts.

Agentic workflows with tool calling: Implement AI agents that can execute functions autonomously. Define tools as TypeScript functions and let the model decide when to call them, enabling multi-step reasoning tasks like booking appointments or querying databases.

Multi-modal applications: Process images alongside text prompts using vision models. Upload a screenshot and ask questions about it, or generate descriptions for accessibility features.

Server-side content generation: Generate SEO-optimized content, email templates, or report summaries in API routes or serverless functions with simple async/await syntax and built-in error handling.

Pros & Cons

Pros

+Provider-agnostic design allows switching models with one line of code, avoiding vendor lock-in
+First-class streaming support with framework-specific hooks makes real-time UIs straightforward
+Built-in tool calling and structured output with Zod validation reduces boilerplate
+Edge runtime compatible and optimized for Next.js App Router patterns
+Strong TypeScript support with comprehensive type inference for prompts and responses

Cons

−Relatively new package with breaking changes between major versions (currently v6.x)
−Provider packages must be installed separately, adding dependency management overhead
−Limited documentation for advanced use cases like custom providers or RAG patterns
−Streaming requires framework-specific setup; vanilla Node.js usage is less ergonomic
−No built-in model cost tracking or request caching, requiring external solutions

Alternatives

langchainv1.2.25

Typescript bindings for langchain

aillmai

1.6M / week

openaiv6.22.0

The official TypeScript library for the OpenAI API

11.8M / week

Install

bash

npm install ai

bash

pnpm add ai

bash

bun add ai

Overview

Quick Start

typescript

import { streamText } from 'ai';
import { openai } from '@ai-sdk/openai';

// Server-side streaming text generation
export async function POST(req: Request) {
  const { messages } = await req.json();

  const result = streamText({
    model: openai('gpt-4-turbo'),
    messages,
    system: 'You are a helpful assistant that provides concise answers.',
    maxTokens: 500,
    temperature: 0.7,
    tools: {
      getWeather: {
        description: 'Get current weather for a location',
        parameters: z.object({
          location: z.string().describe('City name')
        }),
        execute: async ({ location }) => {
          return { temp: 72, condition: 'sunny', location };
        }
      }
    }
  });

  return result.toDataStreamResponse();
}

// Client-side React hook usage
import { useChat } from 'ai/react';

export default function Chat() {
  const { messages, input, handleInputChange, handleSubmit } = useChat({
    api: '/api/chat'
  });

  return (
    <div>
      {messages.map(m => (
        <div key={m.id}>
          <strong>{m.role}:</strong> {m.content}
        </div>
      ))}
      <form onSubmit={handleSubmit}>
        <input value={input} onChange={handleInputChange} />
        <button type="submit">Send</button>
      </form>
    </div>
  );
}

Use Cases

Multi-modal applications: Process images alongside text prompts using vision models. Upload a screenshot and ask questions about it, or generate descriptions for accessibility features.

Pros & Cons

Pros

+Provider-agnostic design allows switching models with one line of code, avoiding vendor lock-in
+First-class streaming support with framework-specific hooks makes real-time UIs straightforward
+Built-in tool calling and structured output with Zod validation reduces boilerplate
+Edge runtime compatible and optimized for Next.js App Router patterns
+Strong TypeScript support with comprehensive type inference for prompts and responses

Cons

−Relatively new package with breaking changes between major versions (currently v6.x)
−Provider packages must be installed separately, adding dependency management overhead
−Limited documentation for advanced use cases like custom providers or RAG patterns
−Streaming requires framework-specific setup; vanilla Node.js usage is less ergonomic
−No built-in model cost tracking or request caching, requiring external solutions

ai

Overview

Quick Start

Use Cases

Pros & Cons

Pros

Cons

Alternatives

Related Content

Install

ai

Overview

Quick Start

Use Cases

Pros & Cons

Pros

Cons

Alternatives

Related Content

Install