TanStack AI + Gonka — টাইপস্ক্রিপ্ট এআই অ্যাপ্লিকেশন নগণ্য খরচে

প্যাকেজ ইনস্টলেশন (কোর + OpenAI-অ্যাডাপ্টার, যেখানে openaiCompatible থাকে):

# pnpm
pnpm add @tanstack/ai @tanstack/ai-openai

# npm
npm install @tanstack/ai @tanstack/ai-openai

React-এ চ্যাট ইন্টারফেসের জন্য ক্লায়েন্ট এবং হুক যুক্ত করুন:

pnpm add @tanstack/ai-client @tanstack/ai-react

JoinGonka API-key: যদি এখনো না থাকে — gate.joingonka.ai/register-এ রেজিস্টার করুন, 3M ফ্রি টোকেন পান এবং Dashboard → API Keys-এ jg-xxx কি (key) তৈরি করুন। একটি কি এবং ব্যালেন্স OpenAI এবং Anthropic উভয় ফরম্যাটের জন্যই কাজ করে।

TanStack AI-তে কাস্টম OpenAI-সামঞ্জস্যপূর্ণ প্রোভাইডার কনফিগার করা হয় openaiCompatible() ফাংশন দিয়ে: একবার baseURL, apiKey এবং মডেলের তালিকা সেট করুন, তারপর প্রতিটি কলের জন্য মডেল বেছে নিন। আমাদের Gateway Chat Completions ফরম্যাটে কথা বলে, তাই আমরা api: 'chat-completions' রাখি (এটাই ডিফল্ট মান)।

import { openaiCompatible } from '@tanstack/ai-openai'

// Gonka provider: configured once
export const gonka = openaiCompatible({
  name: 'gonka',
  baseURL: 'https://gate.joingonka.ai/v1',
  apiKey: process.env.GONKA_API_KEY!, // jg-your-key
  api: 'chat-completions',
  models: [
    'MiniMaxAI/MiniMax-M2.7', // default
    'deepseek-ai/DeepSeek-V4-Flash-0731',
    'zai-org/GLM-5.3-Flash', // reasoning model
  ],
})

সার্ভারে স্ট্রিমিং চ্যাট (যেমন যেকোনো ফুলস্ট্যাক ফ্রেমওয়ার্কে বা TanStack Start-এ রুট হ্যান্ডলার)। উত্তরের দৈর্ঘ্য modelOptions দিয়ে নির্ধারণ করি — নেটিভ wire-প্যারামিটার (max_tokens, temperature) দেওয়ার একমাত্র জায়গা এটাই:

import { chat, toServerSentEventsResponse } from '@tanstack/ai'
import { gonka } from './gonka'

export async function POST(request: Request) {
  const { messages } = await request.json()

  const stream = chat({
    adapter: gonka('MiniMaxAI/MiniMax-M2.7'),
    messages,
    modelOptions: { max_tokens: 8192 }, // Gateway output cap
  })

  return toServerSentEventsResponse(stream)
}

React ক্লায়েন্ট — useChat হুকের মাধ্যমে সার্ভার থেকে UI-তে রেসপন্স স্ট্রিম করে:

import { useChat } from '@tanstack/ai-react'

function Chat() {
  const { messages, sendMessage, status } = useChat({ api: '/api/chat' })

  return (
    <div>
      {messages.map((m) => (
        <p key={m.id}><b>{m.role}:</b> {m.content}</p>
      ))}
      <button onClick={() => sendMessage('What is Gonka?')}>
        Ask
      </button>
    </div>
  )
}

সার্ভার ছাড়া: একই প্রোভাইডার সরাসরি স্ক্রিপ্ট বা ব্যাকএন্ডে কাজ করে — chat() কল করুন এবং স্ট্রিম পড়ুন। Gonka-তে সংযোগ সব ভ্যারিয়েন্টের জন্য একই।

Gateway-এর মাধ্যমে মডেল প্যারামিটার: কনটেক্সট — MiniMax M2.7-এ 180K টোকেন, DeepSeek V4 Flash-এ 380K এবং GLM-5.3 Flash-এ 390K। max_tokens-এর সীমা — MiniMax M2.7 এবং GLM-5.3 Flash-এ 8192, DeepSeek V4 Flash-এ 32768। যদি max_tokens উল্লেখ না করা হয়, non-stream-এর ডিফল্ট 1500, তাই দীর্ঘ উত্তরের জন্য এটি স্পষ্টভাবে সেট করুন।

TanStack AI সরাসরি OpenAI/Anthropic রেট এবং Gonka-এর মাধ্যমে সমানভাবে কাজ করে — কেবল baseURL পরিবর্তিত হয়। কিন্তু খরচে অনেক পার্থক্য রয়েছে। TanStack AI-তে সাধারণ প্রোডাকশন অ্যাপ্লিকেশনের লোড তুলনা করি:

TanStack AI-এর provider-agnostic পদ্ধতি মানে Gonka-তে স্যুইচ করা কোড পুনরায় লেখা নয়, বরং একটি লাইন (baseURL) পরিবর্তন করা। একই সাথে আপনার টাইপ-সেফ টুলস, স্ট্রাকচারড আউটপুট এবং React-হুক অপরিবর্তিত থাকে। হাজার হাজার ব্যবহারকারীর অ্যাপ্লিকেশনের জন্য এটি মাসে কয়েক হাজার ডলার বাঁচায়।

Gonka-এর মূল্য: ইনপুটে প্রতি 1M টোকেনে প্রায় $0.0062, আউটপুটে ×৩। এটি OpenAI এবং Anthropic-এর সরাসরি রেটের চেয়ে শতগুণ থেকে হাজার গুণ সস্তা।

TanStack AI-এর প্রধান বৈশিষ্ট্য হল একক চুক্তি toolDefinition(): একটি টুল একবারই বর্ণনা করা হয় (Zod, ArkType, Valibot বা JSON Schema-এর মাধ্যমে ইনপুট/আউটপুট), আর বাস্তবায়ন সার্ভার বা ক্লায়েন্টে যুক্ত হয়। MiniMax M2.7, DeepSeek V4 Flash এবং GLM-5.3 Flash Gonka-র মাধ্যমে নেটিভ tool calling সমর্থন করে, তাই এজেন্টরা নির্ভরযোগ্যভাবে কাজ করে — টেক্সট রেসপন্স পার্স করার প্রয়োজন ছাড়াই।

import { chat, toolDefinition } from '@tanstack/ai'
import { gonka } from './gonka'
import { z } from 'zod'

const getWeather = toolDefinition({
  name: 'getWeather',
  description: 'Get the weather in a city',
  inputSchema: z.object({ city: z.string() }),
  outputSchema: z.object({ tempC: z.number() }),
}).server(async ({ city }) => {
  return { tempC: 21 } // your real API call
})

const stream = chat({
  adapter: gonka('MiniMaxAI/MiniMax-M2.7'),
  messages: [{ role: 'user', content: 'What is the weather in Moscow?' }],
  tools: [getWeather],
  modelOptions: { max_tokens: 8192 },
})

কোন মডেল বেছে নেবেন:

• MiniMaxAI/MiniMax-M2.7 — ডিফল্ট, গতি ও মানের ভারসাম্য, দীর্ঘ কনটেক্সট। রেসপন্সের সীমা 8192।
• deepseek-ai/DeepSeek-V4-Flash-0731 — নেটওয়ার্কের সবচেয়ে দীর্ঘ কনটেক্সটগুলোর একটি (380K), সস্তা বড় প্রম্পট। রেসপন্সের সীমা 32768।
• zai-org/GLM-5.3-Flash — reasoning মডেল: উত্তরের আগে যুক্তি বিশ্লেষণ করে, জটিল লজিকে শক্তিশালী; নেটওয়ার্কের সবচেয়ে দীর্ঘ কনটেক্সট (390K)। রেসপন্সের সীমা 8192; যুক্তি বিশ্লেষণ max_tokens-এর একটি অংশ খরচ করে।

TanStack AI-তে runtime adapter switching-এর সুবাদে তিনটি মডেলই একটি প্রোভাইডারে রাখা যায় এবং তাৎক্ষণিকভাবে তাদের মধ্যে সুইচ করা যায় — যেমন, যুক্তিনির্ভর কাজ GLM-5.3 Flash-এ, দ্রুত উত্তর MiniMax-এ।