TanStack AI + Gonka — AI-приложения на TypeScript за копейки

Установка пакетов (ядро + 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

API-ключ JoinGonka: если ещё нет — зарегистрируйтесь на gate.joingonka.ai/register, получите 10M бесплатных токенов и создайте ключ jg-xxx в Dashboard → API Keys. Один ключ и один баланс работают и для OpenAI-, и для Anthropic-формата.

В TanStack AI кастомный OpenAI-совместимый провайдер настраивается функцией openaiCompatible(): один раз задаёте baseURL, apiKey и список моделей, а затем выбираете модель на каждый вызов. Наш Gateway говорит на формате Chat Completions, поэтому оставляем api: 'chat-completions' (это значение по умолчанию).

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

// Провайдер Gonka — настраивается один раз
export const gonka = openaiCompatible({
  name: 'gonka',
  baseURL: 'https://gate.joingonka.ai/v1',
  apiKey: process.env.GONKA_API_KEY!, // jg-ваш-ключ
  api: 'chat-completions',
  models: [
    'Qwen/Qwen3-235B-A22B-Instruct-2507-FP8', // дефолт
    'moonshotai/Kimi-K2.6',
    'MiniMaxAI/MiniMax-M2.7',
  ],
})

Streaming-чат на сервере (например, route-хендлер в любом fullstack-фреймворке или 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('Qwen/Qwen3-235B-A22B-Instruct-2507-FP8'),
    messages,
    modelOptions: { max_tokens: 8192 }, // потолок Qwen через Gateway
  })

  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('Что такое Gonka?')}>
        Спросить
      </button>
    </div>
  )
}

Без сервера: тот же провайдер работает в скрипте или бэкенде напрямую — вызывайте chat() и читайте поток. Подключение к Gonka одинаково для всех вариантов.

Параметры моделей через Gateway: контекст у всех трёх моделей — 128K токенов. Потолок max_tokens: Qwen3-235B — 8192, Kimi K2.6 — 3072, MiniMax-M2.7 — 4096. Если max_tokens не указан, дефолт для non-stream — 1500, поэтому для длинных ответов задавайте его явно.

TanStack AI одинаково удобно работает и через прямые тарифы OpenAI/Anthropic, и через Gonka — меняется только baseURL. Но цена отличается на порядки. Сравним типичные нагрузки production-приложения на TanStack AI:

Provider-agnostic подход TanStack AI означает, что переключиться на Gonka — это правка одной строки (baseURL), а не переписывание кода. При этом ваши типобезопасные tools, структурированный вывод и React-хуки остаются без изменений. Для приложения с тысячами пользователей разница — десятки тысяч долларов в месяц.

Цена Gonka: вход ~$0.0005 за 1M токенов, выход ×3. Это в сотни–тысячи раз дешевле прямых тарифов OpenAI и Anthropic.

Главная фишка TanStack AI — единый контракт toolDefinition(): инструмент описывается один раз (вход/выход через Zod, ArkType, Valibot или JSON Schema), а реализация привязывается на сервере или клиенте. Qwen3-235B, Kimi K2.6 и MiniMax-M2.7 поддерживают нативный tool calling через Gonka, поэтому агенты работают надёжно — без парсинга текстовых ответов.

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

const getWeather = toolDefinition({
  name: 'getWeather',
  description: 'Узнать погоду в городе',
  inputSchema: z.object({ city: z.string() }),
  outputSchema: z.object({ tempC: z.number() }),
}).server(async ({ city }) => {
  return { tempC: 21 } // ваш реальный вызов API
})

const stream = chat({
  adapter: gonka('Qwen/Qwen3-235B-A22B-Instruct-2507-FP8'),
  messages: [{ role: 'user', content: 'Какая погода в Москве?' }],
  tools: [getWeather],
  modelOptions: { max_tokens: 8192 },
})

Какую модель выбрать:

• Qwen/Qwen3-235B-A22B-Instruct-2507-FP8 — дефолт. Самый большой потолок ответа (8192) и сильный tool calling. Подходит для агентов и структурированного вывода.
• moonshotai/Kimi-K2.6 — отличен для длинных диалогов и рассуждений. Потолок ответа 3072.
• MiniMaxAI/MiniMax-M2.7 — баланс скорости и качества, потолок 4096.

Благодаря runtime adapter switching в TanStack AI можно держать все три модели в одном провайдере и переключаться между ними на лету — например, тяжёлые агентские задачи на Qwen, быстрые ответы на MiniMax.