Skip to content
Avatar of vercel-labsvercel-labs/ai-sdk-preview-array-output-mode

Array Output Mode - AI SDK

Learn the difference between array and object output modes with streamObject from the AI SDK.

Framework
Use Case
ai-sdk-template-array-output-mode-og

Structured Object Generation Array Mode

This is a Next.js project that uses the the streamObject function from the Vercel AI SDK to stream structured objects. This project showcases the new output mode which allows you to stream structured objects by complete object rather than by token. This solves layout shift issues common to AI applications using structured object generation.

Getting Started

First, clone the repository:

git clone https://github.com/vercel-labs/structured-object-generation-array-mode.git

Then, install the dependencies:

pnpm install

Copy the .env.exampmle file to .env.local and fill in the required environment variables:

OPENAI_API_KEY=sk-...

Finally, run the development server:

pnpm dev

Open http://localhost:3000 with your browser to see the result.

Learn More

To learn more about Next.js, take a look at the following resources:

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

ai-sdk-template-array-output-mode-og
Avatar of vercel-labsvercel-labs/ai-sdk-preview-array-output-mode

Array Output Mode - AI SDK

Learn the difference between array and object output modes with streamObject from the AI SDK.

Framework
Use Case

Structured Object Generation Array Mode

This is a Next.js project that uses the the streamObject function from the Vercel AI SDK to stream structured objects. This project showcases the new output mode which allows you to stream structured objects by complete object rather than by token. This solves layout shift issues common to AI applications using structured object generation.

Getting Started

First, clone the repository:

git clone https://github.com/vercel-labs/structured-object-generation-array-mode.git

Then, install the dependencies:

pnpm install

Copy the .env.exampmle file to .env.local and fill in the required environment variables:

OPENAI_API_KEY=sk-...

Finally, run the development server:

pnpm dev

Open http://localhost:3000 with your browser to see the result.

Learn More

To learn more about Next.js, take a look at the following resources:

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Unleash New Possibilities

Deploy your app on Vercel and unlock its full potential