Vercel AI SDK व्यावहारिक: स्मार्ट तरीके से शिप करें, मेहनत से नहीं

एक fintech क्लाइंट मुझे देर 2023 में फोन किया, उसकी आवाज़ में असली panic था, क्योंकि उसकी dev टीम OpenAI के API के ऊपर एक streaming chat interface बनाने में छह हफ़्ते बिता चुकी थी और यह अभी भी mobile Safari पर broken था। Race conditions। Token chunking issues। UI response के बीच में freeze हो जाता था। छह हफ़्ते। मैंने उनके codebase को देखा और यह बिल्कुल वही था जो आप उम्मीद करेंगे: एक hand-rolled ReadableStream implementation, streaming tokens के लिए एक custom state management layer, retry logic जो तीन साल पहले के Stack Overflow answer से copy किया गया था। चीज़ को tape से रखा गया था।

मैंने Vercel AI SDK का उपयोग करके लगभग दो दिन में इसके core को फिर से लिखा। Streaming काम कर गया। Mobile Safari काम कर गया। क्लाइंट ने फोन करना बंद कर दिया।

यह pitch नहीं है। यह बस वह है जो हुआ। और यही कारण है कि मैं इस बारे में बात करना चाहता हूँ कि यह SDK असल में क्या करता है, कहाँ यह सच में आपका समय बचाता है, और कहाँ आप अभी भी दीवार से टकराएंगे।

Vercel AI SDK असल में क्या है

जब लोग "Vercel AI SDK" सुनते हैं तो वे मानते हैं कि यह Vercel infrastructure में locked है। यह नहीं है। आप इसे किसी भी Node.js server पर चला सकते हैं, आपके अपने VPS, Railway, Render, कहीं भी। यह असल में: एक TypeScript library है जो LLM-powered features को web app में बनाने के सबसे messy parts को abstract कर देती है।

दो मुख्य पैकेज हैं जिन्हें आप उपयोग करेंगे। ai कोर रनटाइम है। @ai-sdk/openai (या @ai-sdk/anthropic, @ai-sdk/google, आदि) प्रोवाइडर एडाप्टर हैं। SDK एक unified interface उपयोग करता है, इसलिए GPT-4o से Claude 3.5 Sonnet पर स्विच करना ज्यादातर मामलों में genuinely एक लाइन का बदलाव है। मैंने इसे test किया है। यह काम करता है।

Core Primitives

SDK के दिल में तीन चीजें हैं:

• streamText, token by token टेक्स्ट response stream करता है, chat interfaces के लिए ideal है
• generateText, पूरे response का इंतज़ार करता है, background jobs के लिए या जब आपको streaming UX की ज़रूरत नहीं है, अच्छा है
• generateObject, structured JSON return करता है जो Zod schema के विरुद्ध validated है, यही वह जगह है जहाँ चीजें properly interesting हो जाती हैं

streamText वह है जो ज्यादातर लोग पहले चाहते हैं। यह ReadableStream plumbing, encoding, और chunking को handle करता है। वह छह-सप्ताह वाली fintech nightmare जिसका मैंने ज़िक्र किया? वह बिल्कुल वही है जो streamText ने day one पर solve किया होता।

इसे बिना अपना दिमाग़ खोए Set Up करना

मान लीजिए आप Next.js 14 या 15 पर हैं App Router के साथ (जो आप शायद हैं अगर आप यह 2025 में पढ़ रहे हैं), setup genuinely तेज़ है।

1. पैकेज install करें: npm install ai @ai-sdk/openai
2. app/api/chat/route.ts पर एक route handler बनाएँ
3. streamText और अपने provider को import करें, अपने model और messages को pass करें, और result को StreamingTextResponse के रूप में return करें
4. client पर, ai/react package से useChat hook का उपयोग करें

बस इतना ही। अगर आप Next.js को उचित तरीके से जानते हैं तो आपके पास एक घंटे से कम में एक काम करने वाला streaming chat होगा। useChat hook message array, loading state, input field binding, और streaming updates को manage करता है। आप इनमें से कोई भी चीज़ खुद नहीं लिखते।

जो मैं किसी भी production setup में तुरंत जोड़ूँगा: एक proper system prompt, rate limiting (मैं इसके लिए Upstash का उपयोग करता हूँ, उनका Redis-backed rate limiter Edge Functions के साथ बहुत अच्छी तरह काम करता है), और किसी प्रकार की token usage logging। SDK response object पर usage data को expose करता है, इसलिए आप कोई अतिरिक्त API calls किए बिना अपने database को prompt tokens और completion tokens log कर सकते हैं।

generateObject वह Feature है जिस पर आप सो रहे हैं

ईमानदार राय: streamText को सभी चर्चा मिलती है लेकिन generateObject वह है जिसने मेरे AI features को architect करने के तरीके को बदल दिया है।

विचार सरल है। आप एक Zod schema define करते हैं, इसे generateObject को pass करते हैं, और SDK model को JSON return करने के लिए निर्देश देता है जो इसके अनुरूप हो। आपको एक typed object मिलता है, न कि एक string जिसे आपको parse करना और pray करना हो।

Seahawk के पास पिछले साल एक property management company के लिए एक project था। वे uploaded lease documents से structured data निकालना चाहते थे, tenant names, rent amounts, break clauses, renewal dates। पुराने approach में: model को prompt करो, text वापस पाओ, एक regex parser लिखो, रो। generateObject के साथ, हमने Zod के साथ एक LeaseSchema define किया, और model हर बार clean typed data return करता था। हम extracted leases को एक सप्ताह में Postgres table में push कर रहे थे।

जो चीज़ लोगों को confuse करती है: सभी models structured output को समान रूप से support नहीं करते। GPT-4o और Claude 3.5 Sonnet इसे reliably handle करते हैं। कुछ छोटे या पुराने models fields को hallucinate करेंगे या schema को पूरी तरह ignore करेंगे। इसके लिए flagship models पर stick करो, कम से कम जब तक आप अपने use case को validate न कर लो।

Tool Calling: जहाँ असली ताकत है

अगर generateObject का कम इस्तेमाल होता है, तो tool calling को गलत समझा जाता है। ज़्यादातर डेवलपर सोचते हैं कि "tool calling" का मतलब है कि AI इंटरनेट ब्राउज़ कर सकता है या कोड चला सकता है। कभी-कभी कर सकता है। लेकिन असल में, tools सिर्फ वे functions होते हैं जो आप define करते हैं और model अपने response के दौरान उन्हें invoke करने का चुनाव कर सकता है।

इसे कैसे समझें

मान लीजिए आप एक SaaS product के लिए support bot बना रहे हैं। user पूछता है "मेरी current subscription plan क्या है?" Model को यह नहीं पता हो सकता। लेकिन आप एक getUserSubscription tool define कर सकते हैं जो एक user ID लेता है और आपके database से plan का डेटा return करता है। Model intent को पहचानता है, tool को call करता है, डेटा वापस पाता है, और उसे अपने response में शामिल करता है। User को सिर्फ एक coherent answer दिखता है।

SDK का tools parameter streamText और generateText पर एक object लेता है जहाँ हर key एक tool का नाम होता है, और हर value का एक description (जो model use करता है यह decide करने के लिए कि कब इसे call करना है), एक parameters schema (फिर से Zod), और एक execute function होता है। execute function server-side पर run होता है, safely, client से दूर।

मैंने इसी तरीके से multi-step agents बनाए हैं। SDK maxSteps को support करता है ताकि model tool calls को chain कर सके, एक tool call करे, result का इस्तेमाल करे, दूसरा tool call करे, सब कुछ synthesise करे, respond करे। यह magic नहीं है। आपको अभी भी अपने tool descriptions और अपने system prompt के बारे में सावधानी से सोचना होगा। लेकिन सारी wiring आपके लिए handle की जाती है।

Middleware, Wrapping, और Pipeline Model

एक चीज़ जिसकी मुझे appreci नहीं हुई जब तक मैंने docs को गहराई से नहीं पढ़ा: SDK के पास एक middleware concept है जो आपको model calls को wrap करने देता है logging, caching, या custom behaviour add करने के लिए बिना अपने actual feature code को छुए।

wrapLanguageModel एक model और एक middleware object लेता है। आप requests को API से पहले intercept कर सकते हैं, parameters को modify कर सकते हैं, responses को cache कर सकते हैं। मैंने इसे एक publisher के लिए एक content generation tool पर use किया, उनके use case में बहुत सारे repeated prompts थे (एक ही article summary दिन में कई बार request किया जा रहा था), और हमने middleware layer का use करके Redis में responses को cache किया। Cost पहले महीने में लगभग 35% गिर गया।

यह वह चीज़ है जो आप normally अपने API calls के चारों ओर awkwardly bolt on करते हैं। इसे SDK में एक first-class concept के रूप में रखने का मतलब है कि यह composable और testable है।

यह क्या नहीं करता (अपने आप से ईमानदार रहें)

ठीक है। मैं आपको कुछ परेशानी से बचा देता हूँ।

SDK आपके लिए मेमोरी या लंबे समय तक बातचीत का इतिहास संभालता नहीं है। useChat क्लाइंट स्टेट में मैसेज ऐरे को बनाए रखता है, लेकिन जिस क्षण यूजर रीफ्रेश करता है, वह चला जाता है। अगर आपको स्थायी बातचीत चाहिए, तो आप उसे खुद बनाएंगे। मैसेज स्टोरेज के लिए Postgres या MongoDB, माउंट पर फेच करके चैट को रीहाइड्रेट करना, यह सब कुछ प्रदान नहीं किया जाता। वास्तव में, यह सही व्यवहार है। SDK को आपकी डेटा लेयर के मालिक नहीं होना चाहिए। लेकिन नए लोग अक्सर इसकी उम्मीद करते हैं।

यह मल्टीमोडल इनपुट को भी नेटिव तरीके से ऐसे नहीं संभालता जो सारी जटिलता को हटा दे। आप मैसेज ऐरे में इमेज URLs पास कर सकते हैं और GPT-4o जैसे मॉडल उन्हें ठीक से संभाल लेंगे, लेकिन प्रीव्यू, कंप्रेशन और स्टोरेज के साथ एक सही इमेज अपलोड फ्लो बनाना अभी भी आपका काम है। जब मैं Next.js पर होता हूँ तो इसके लिए मैं Uploadthing का इस्तेमाल करता हूँ, इसे वायर करने में करीब 30 मिनट लगते हैं।

RAG (retrieval-augmented generation) भी शामिल नहीं है। कोई बिल्ट-इन वेक्टर सर्च नहीं है, कोई एम्बेडिंग पाइपलाइन नहीं, कोई चंकिंग लॉजिक नहीं। इसके लिए आप Postgres पर pgvector जैसी किसी चीज़ या Pinecone जैसी एक समर्पित सेवा का इस्तेमाल करते हैं। SDK LLM कॉल को संभालता है। बाकी रिट्रीवल आर्किटेक्चर आपको बनाना है।

इसे डिप्लॉय करना: Vercel बनाम बाकी सब कुछ

हाँ, SDK Vercel पर सबसे अच्छे तरीके से काम करता है। StreamingTextResponse Vercel के Edge Runtime के साथ सीधे काम करता है, और Edge Functions पर कोल्ड स्टार्ट्स सर्वरलेस Node.js फंक्शन्स की तुलना में बहुत कम हैं। अगर आपकी चैट के जवाब सुस्त लगते हैं, तो पहले टोकन तक का लेटेंसी बहुत मायने रखता है, और Edge इसे कम कर देता है।

लेकिन मैंने इसे Railway पर डिप्लॉय किया है (Node.js, Edge नहीं) और यह ठीक काम करता है। आप सिर्फ सही स्ट्रीमिंग हेडर्स के साथ Response का इस्तेमाल करते हैं Vercel-विशेष हेल्पर्स की जगह, और SDK डॉक्स इसे कवर करते हैं। "Vercel AI SDK" आपको यह सोचने दें कि आप लॉक-इन हैं, ऐसा न सोचें।

एक चीज़ जिसकी मैं सच में सलाह दूँगा: अपने AI route handlers को पतला रखें। एक फंक्शन में डेटाबेस क्वेरीज़, आथेंटिकेशन चेक्स और LLM कॉल्स सब न करें। Middleware (Next.js मिडलवेयर, SDK मिडलवेयर नहीं) को आपके AI रूट तक रिक्वेस्ट पहुँचने से पहले ही आथेंटिकेशन को संभालना चाहिए। चीजें तेज़ रहती हैं, चीजें डीबग करने योग्य रहती हैं।

FAQ

क्या Vercel AI SDK उपयोग करने के लिए मुक्त है?

SDK स्वयं ओपन सोर्स और मुक्त है। आप अंतर्निहित मॉडल API के लिए भुगतान कर रहे हैं — OpenAI, Anthropic, Google, जो कोई भी आप कॉल कर रहे हैं। ये लागतें आपकी ज़िम्मेदारी हैं। SDK कुछ भी मार्कअप नहीं करता।

क्या मैं इसे OpenAI के अलावा अन्य मॉडल के साथ उपयोग कर सकता हूँ?

हाँ, और यह इसकी असली ताकत में से एक है। Anthropic, Google (Gemini), Mistral, Groq, Cohere और अन्य के लिए आधिकारिक adapter हैं। कम्युनिटी ने Ollama के लिए भी adapter बनाए हैं अगर आप स्थानीय मॉडल चलाना चाहते हैं। unified interface का मतलब है कि आपका feature code नहीं बदलता जब आप provider स्विच करते हैं।

क्या यह React Server Components के साथ काम करता है?

आंशिक रूप से। generateText और generateObject Server Components में बिना किसी समस्या के चल सकते हैं, वे बस async functions हैं। streamText useChat hook के साथ client-side state की आवश्यकता है, इसलिए वह हिस्सा Client Component में रहता है। यह मानक Next.js architecture है और अगर आप boundary को समझते हैं तो यह आपको कोई परेशानी नहीं देगा।

जब API डाउन हो तो मैं errors को कैसे handle करूँ?

SDK typed errors फेंकता है जिन्हें आप catch और handle कर सकते हैं। व्यावहारिक रूप से मैं अपने LLM calls को try/catch में wrap करता हूँ और UI में broken partial response की तरह stream error को bubble up करने देने के बजाय graceful fallback message return करता हूँ। SDK docs error handling पर error types को detail में cover करते हैं और production जाने से पहले पढ़ने लायक हैं।

token limit की स्थिति क्या है?

SDK context window limits को आपके लिए manage नहीं करता। अगर आप लंबे समय तक चलने वाली conversation बना रहे हैं और आप message history को trim नहीं करते, तो आप मॉडल के context window से टकराएँगे और error मिलेगी। सरल समाधान: आखिरी N messages रखें (मैं आमतौर पर 20 करता हूँ) साथ ही एक pinned system prompt। अधिकांश chat applications के लिए काफी अच्छा है।

---

देखिए, Vercel AI SDK कोई चमत्कार नहीं है। यह कुछ वाकई बोझिल तकनीकी काम के ऊपर एक अच्छी तरह से डिज़ाइन किया गया अमूर्तन है। यह स्ट्रीमिंग को सही तरीके से संभालता है, यह आपको टाइप किए गए संरचित आउटपुट देता है, यह टूल कॉलिंग को सरल बनाता है, और यह विभिन्न प्रदाताओं में काम करता है। AI फीचर वर्क के 80% के लिए जो मैं लेता हूँ, यह सही शुरुआती बिंदु है।

वह fintech क्लाइंट, वैसे, मैंने इसे फिर से लिखने के दो हफ्ते बाद रीबिल्ट चैट के साथ लाइव गया। mobile Safari पर कोई समस्या नहीं। कोई race condition नहीं। छह हफ्ते दो दिन में बदल गए। कभी-कभी सही अमूर्तन बहुत मूल्यवान होता है।

संबंधित पढ़ना: 2026 में Headless बनाम WordPress सुरक्षा: Next.js और Astro, headless, और Astro क्यों।