TanStack AI + Gonka — Applications IA en TypeScript pour une bouchée de pain

Installation des paquets (noyau + adaptateur OpenAI, où vit openaiCompatible) :

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

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

Pour l'interface de chat sur React, ajoutez le client et les hooks :

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

Clé API JoinGonka : si vous n'en avez pas encore — inscrivez-vous sur gate.joingonka.ai/register, obtenez 10 millions de jetons gratuits et créez une clé jg-xxx dans le tableau de bord → Clés API. Une seule clé et un seul solde fonctionnent pour les formats OpenAI et Anthropic.

Dans TanStack AI, un fournisseur personnalisé compatible OpenAI est configuré avec la fonction openaiCompatible() : vous spécifiez une seule fois baseURL, apiKey et une liste de modèles, puis vous choisissez le modèle pour chaque appel. Notre passerelle utilise le format Chat Completions, nous laissons donc api: 'chat-completions' (c'est la valeur par défaut).

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

// Fournisseur Gonka — configuré une seule fois
export const gonka = openaiCompatible({
  name: 'gonka',
  baseURL: 'https://gate.joingonka.ai/v1',
  apiKey: process.env.GONKA_API_KEY!, // jg-votre-clé
  api: 'chat-completions',
  models: [
    'Qwen/Qwen3-235B-A22B-Instruct-2507-FP8', // défaut
    'moonshotai/Kimi-K2.6',
    'MiniMaxAI/MiniMax-M2.7',
  ],
})

Chat en streaming sur le serveur (par exemple, un gestionnaire de route dans n'importe quel framework fullstack ou TanStack Start). Nous définissons la longueur de la réponse via modelOptions — c'est le seul point pour les paramètres natifs (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 }, // plafond Qwen via Gateway
  })

  return toServerSentEventsResponse(stream)
}

Client React via le hook useChat — diffuse les réponses du serveur dans l'interface utilisateur :

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('Qu'est-ce que Gonka ?')}>
        Demander
      </button>
    </div>
  )
}

Sans serveur : le même fournisseur fonctionne directement dans un script ou un backend — appelez chat() et lisez le flux. La connexion à Gonka est la même pour toutes les variantes.

Paramètres des modèles via la passerelle : le contexte de tous les trois modèles est de 128K jetons. Plafond max_tokens : Qwen3-235B — 8192, Kimi K2.6 — 3072, MiniMax-M2.7 — 4096. Si max_tokens n'est pas spécifié, la valeur par défaut pour le non-stream est de 1500, il est donc conseillé de le définir explicitement pour les longues réponses.

TanStack AI fonctionne aussi bien avec les tarifs directs d'OpenAI/Anthropic que via Gonka — seul l'baseURL change. Mais le prix diffère par des ordres de grandeur. Comparons les charges typiques d'une application de production sur TanStack AI:

L'approche agnostique du fournisseur de TanStack AI signifie que le passage à Gonka est un changement d'une seule ligne (baseURL), pas une réécriture de code. Vos outils typés, votre sortie structurée et vos hooks React restent inchangés. Pour une application avec des milliers d'utilisateurs, la différence est de dizaines de milliers de dollars par mois.

Prix Gonka: entrée ~$0.0005 par 1M de jetons, sortie ×3. C'est des centaines à des milliers de fois moins cher que les tarifs directs d'OpenAI et d'Anthropic.

La principale caractéristique de TanStack AI est le contrat unifié toolDefinition(): l'outil est décrit une fois (entrée/sortie via Zod, ArkType, Valibot ou JSON Schema), et l'implémentation est liée sur le serveur ou le client. Qwen3-235B, Kimi K2.6 et MiniMax-M2.7 prennent en charge l'appel d'outil natif via Gonka, de sorte que les agents fonctionnent de manière fiable — sans analyser les réponses texte.

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

const getWeather = toolDefinition({
  name: 'getWeather',
  description: 'Obtenir la météo dans une ville',
  inputSchema: z.object({ city: z.string() }),
  outputSchema: z.object({ tempC: z.number() }),
}).server(async ({ city }) => {
  return { tempC: 21 } // votre véritable appel API
})

const stream = chat({
  adapter: gonka('Qwen/Qwen3-235B-A22B-Instruct-2507-FP8'),
  messages: [{ role: 'user', content: 'Quel temps fait-il à Moscou ?' }],
  tools: [getWeather],
  modelOptions: { max_tokens: 8192 },
})

Quel modèle choisir:

• Qwen/Qwen3-235B-A22B-Instruct-2507-FP8 — par défaut. Le plafond de réponse le plus élevé (8192) et un appel d'outil puissant. Convient aux agents et à la sortie structurée.
• moonshotai/Kimi-K2.6 — excellent pour les longs dialogues et le raisonnement. Plafond de réponse 3072.
• MiniMaxAI/MiniMax-M2.7 — équilibre entre vitesse et qualité, plafond 4096.

Grâce au changement d'adaptateur à l'exécution dans TanStack AI, vous pouvez conserver les trois modèles dans un seul fournisseur et basculer entre eux à la volée — par exemple, les tâches d'agent lourdes sur Qwen, les réponses rapides sur MiniMax.