TanStack AI + Gonka — Ứng dụng AI trên TypeScript giá rẻ

Cài đặt gói (phần cốt lõi + bộ điều hợp OpenAI, nơi chứa openaiCompatible):

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

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

Đối với giao diện trò chuyện trên React, hãy thêm client và hook:

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

API-key JoinGonka: nếu chưa có, hãy đăng ký tại gate.joingonka.ai/register, nhận 10 triệu token miễn phí và tạo khóa jg-xxx trong Dashboard → API Keys. Một khóa và một số dư hoạt động cho cả định dạng OpenAI và Anthropic.

Trong TanStack AI, một provider tùy chỉnh tương thích với OpenAI được thiết lập bằng hàm openaiCompatible(): bạn cấu hình baseURL, apiKey và danh sách các mô hình một lần, sau đó chọn mô hình cho mỗi lần gọi. Gateway của chúng tôi sử dụng định dạng Chat Completions, vì vậy chúng tôi để api: 'chat-completions' (đây là giá trị mặc định).

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

// Provider Gonka — thiết lập một lần
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: [
    'moonshotai/Kimi-K2.6', // mặc định
    'MiniMaxAI/MiniMax-M2.7',
  ],
})

Streaming chat trên server (ví dụ: route handler trong bất kỳ fullstack framework nào hoặc TanStack Start). Chúng ta thiết lập độ dài phản hồi thông qua modelOptions — đây là điểm duy nhất cho các tham số wire gốc (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 }, // giới hạn output thông qua Gateway
  })

  return toServerSentEventsResponse(stream)
}

React-client thông qua hook useChat — stream phản hồi từ server ra 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('Gonka là gì?')}>
        Hỏi
      </button>
    </div>
  )
}

Không cần server: cùng một provider hoạt động trực tiếp trong script hoặc backend — hãy gọi chat() và đọc luồng (stream). Kết nối tới Gonka là giống nhau cho mọi phương thức.

Tham số mô hình qua Gateway: ngữ cảnh (context) cho cả hai mô hình là 200K token. Giới hạn max_tokens là 8192 cho tất cả các mô hình trong mạng lưới. Nếu max_tokens không được chỉ định, mặc định cho non-stream là 1500, vì vậy hãy đặt nó một cách rõ ràng cho các phản hồi dài.

TanStack AI hoạt động tiện lợi qua cả mức giá trực tiếp của OpenAI/Anthropic và qua Gonka — chỉ cần thay đổi baseURL. Nhưng giá cả chênh lệch tới hàng chục lần. Hãy so sánh các tải trọng điển hình của ứng dụng production trên TanStack AI:

Cách tiếp cận Provider-agnostic của TanStack AI có nghĩa là việc chuyển sang Gonka chỉ cần chỉnh sửa một dòng (baseURL), thay vì viết lại mã. Đồng thời, các công cụ type-safe, đầu ra có cấu trúc và React-hook của bạn vẫn không thay đổi. Đối với một ứng dụng có hàng nghìn người dùng, sự khác biệt là hàng chục nghìn đô la mỗi tháng.

Giá của Gonka: đầu vào ~$0.003 cho 1M token, đầu ra ×3. Mức giá này rẻ hơn hàng trăm đến hàng nghìn lần so với biểu giá trực tiếp của OpenAI và Anthropic.

Tính năng chính của TanStack AI là hợp đồng thống nhất toolDefinition(): một công cụ được mô tả một lần (input/output thông qua Zod, ArkType, Valibot hoặc JSON Schema), và việc triển khai được gắn vào phía server hoặc client. Kimi K2.6 và MiniMax-M2.7 hỗ trợ native tool calling thông qua Gonka, vì vậy các agent hoạt động đáng tin cậy — mà không cần phải phân tích cú pháp các phản hồi văn bản.

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

const getWeather = toolDefinition({
  name: 'getWeather',
  description: 'Kiểm tra thời tiết ở một thành phố',
  inputSchema: z.object({ city: z.string() }),
  outputSchema: z.object({ tempC: z.number() }),
}).server(async ({ city }) => {
  return { tempC: 21 } // gọi API thực tế của bạn
})

const stream = chat({
  adapter: gonka('MiniMaxAI/MiniMax-M2.7'),
  messages: [{ role: 'user', content: 'Thời tiết ở Moscow thế nào?' }],
  tools: [getWeather],
  modelOptions: { max_tokens: 8192 },
})

Chọn mô hình nào:

• moonshotai/Kimi-K2.6 — mạnh về lập trình, suy luận và các kịch bản agent. Giới hạn phản hồi 8192.
• MiniMaxAI/MiniMax-M2.7 — mặc định, cân bằng giữa tốc độ và chất lượng, ngữ cảnh dài. Giới hạn phản hồi 8192.

Nhờ tính năng runtime adapter switching trong TanStack AI, bạn có thể giữ cả hai mô hình trong cùng một provider và chuyển đổi giữa chúng một cách tức thì — ví dụ: các tác vụ agent phức tạp sử dụng Kimi, các phản hồi nhanh sử dụng MiniMax.