Array Output Mode - AI SDK
Learn the difference between array and object output modes with streamObject from the AI SDK.
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:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
- Vercel AI SDK - learn about the Vercel AI SDK.
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.
Array Output Mode - AI SDK
Learn the difference between array and object output modes with streamObject from the AI SDK.
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:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
- Vercel AI SDK - learn about the Vercel AI SDK.
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.