Vercel AI SDK v5 به توسعه‌دهندگان React اجازه می‌دهد فراخوانی‌های مدل‌های زبانی بزرگ (LLM) را به سمت سرور منتقل کنند، کلیدهای API را مخفی نگه دارند و تأخیر (latency) ناشی از استریم کردن تکه‌های متن در مرورگر را به شدت کاهش دهند. معماری جدید مبتنی بر transport نیز مدیریت وضعیت (state handling) را جدا می‌کند، به طوری که کدهای UI سبک باقی می‌مانند در حالی که SDK وظایف استریم، تاریخچه و فراخوانی ابزارها (tool invocations) را مدیریت می‌کند.

چرا رویکرد قدیمی مدل را مختل می‌کرد

بیشتر چت‌بات‌های React که قبل از نسخه ۵ ساخته شده بودند، خروجی مدل را مستقیماً به کلاینت استریم می‌کردند. این امر توسعه‌دهندگان را مجبور می‌کرد تا کلید مخفی LLM را در کدهای فرانت‌اند قرار دهند که باعث لو رفتن آن در بخش network inspector مرورگر می‌شد. تیم‌ها همچنین از useState برای بافر کردن هر توکن ورودی استفاده می‌کردند که باعث می‌شد با هر تکه کوچک متن، یک re-render رخ دهد. نتیجه این بود که UI دچار پرش (flicker) می‌شد و کدها به مجموعه‌ای درهم‌تنیده از callbackها تبدیل می‌شدند.

نتیجه: هر کسی می‌توانست کلید را سرقت کند و در حالی که توسعه‌دهندگان با پیچیدگی‌های مدیریت وضعیت در سطح پایین دست‌وپنجه نرم می‌کردند، مکالمه دچار لگ (lag) می‌شد.

تغییرات نسخه ۵ در لایه‌های زیرین

  • معماری مبتنی بر transport – اکنون SDK با اتصال به LLM به عنوان یک لایه transport ماژولار برخورد می‌کند. فراخوانی‌ها از یک API route در سرور شروع می‌شوند، بنابراین کلید مخفی هرگز از بک‌اند خارج نمی‌شود. لایه transport پروتکل استریم را انتزاع (abstract) می‌کند و یک استریم تمیز و تایپ‌شده از پیام‌ها را به فرانت‌اند تحویل می‌دهد.

  • فراخوانی ابزارهای تایپ‌شده (Typed Tool Invocations) – زمانی که مدل تصمیم می‌گیرد یک ابزار را فراخوانی کند (مثلاً جستجوی وضعیت آب‌وهوا یا دریافت تقویم)، SDK درخواست را در قالب یک payload تایپ‌شده بسته‌بندی می‌کند. فرانت‌اند مستقیماً ساختار payload را می‌خواند که باعث حذف تجزیه (parsing)‌های دستی و کاهش خطاهای زمان اجرا (runtime errors) می‌شود.

  • مدیریت وضعیت مجزا (Decoupled State Management) – هوک useChat دیگر توسعه‌دهنده را مجبور به استفاده از یک استور وضعیت واحد نمی‌کند. این هوک callbackها و ابزارهایی را ارائه می‌دهد که هر کتابخانه مدیریت وضعیتی — مانند Zustand، Redux یا React context ساده — می‌تواند از آن‌ها استفاده کند. کامپوننت‌های UI بر رندر کردن تمرکز می‌کنند، در حالی که سنگینی کار را SDK بر عهده می‌گیرد.

یک گردش کار کاربردی

  1. منطق LLM در سمت سرور – در یک API route، تابع streamText (یا معادل آن برای استریم کردن) را فراخوانی کنید. SDK خروجی مدل را از طریق یک اتصال امن به کلاینت استریم می‌کند و کلید API را از مرورگر دور نگه می‌دارد.
  2. رابط کاربری در سمت کلاینت – هوک useChat را در یک کامپوننت React وارد (import) کنید. این هوک لیست پیام‌های فعلی، تابعی برای ارسال ورودی جدید کاربر و پرچم‌های وضعیت (status flags) را برمی‌گرداند. از آنجایی که وضعیت در جای دیگری ذخیره می‌شود، می‌توانید هر مدیریت وضعیت که از قبل استفاده می‌کنید را به آن متصل کنید.
  3. مدیریت ابزارها – وقتی مدل یک فراخوانی ابزار (tool call) صادر می‌کند، SDK یک شیء ساختاریافته را به کلاینت تحویل می‌دهد. می‌توانید یک ویجت آب‌وهوا، یک انتخاب‌گر تقویم یا هر عنصر UI سفارشی را بدون نوشتن کدهای همگام‌سازی دستی رندر کنید.

نتیجه یک جداسازی تمیز است: سرور تمام تعاملات LLM را بر عهده دارد و کلاینت فقط مسئول نمایش است. دیگر خبری از parsing استریم‌های خام، نشت تصادفی کلیدها و پرش UI ناشی از re-renderهای مربوط به هر توکن نیست.

چه کسانی سود می‌برند و چه کسانی ممکن است تردید کنند

آنچه باید در ادامه زیر نظر داشت

خلاصه نهایی

Vercel AI SDK v5 با انتقال فراخوانی‌های LLM به سرور، ارائه داده‌های تایپ‌شده برای ابزارها و رها کردن فرانت‌اند از مدیریت پیچیده وضعیت در سطح پایین، توسعه چت‌بات‌های React را بازتعریف می‌کند. این تغییر دو مشکل بزرگ — یعنی لو رفتن کلیدهای مخفی و پرش‌های UI — را برطرف می‌کند و در عین حال به توسعه‌دهندگان اجازه می‌دهد کنترل پشته وضعیت (state stack) خود را حفظ کنند.