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

Installation des packages (core + adaptateur OpenAI, où vit openaiCompatible) :

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

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

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

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

Clé API JoinGonka : si vous ne l'avez pas encore — inscrivez-vous sur gate.joingonka.ai/register, obtenez 3M jetons gratuits et créez une clé jg-xxx dans le Dashboard → API Keys. 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 définissez une fois baseURL, apiKey et la liste des modèles, puis vous choisissez le modèle à chaque appel. Notre Gateway utilise le format Chat Completions, nous conservons donc api: 'chat-completions' (c'est la valeur par défaut).

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

// Le 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: [
    'MiniMaxAI/MiniMax-M2.7', // par défaut
    'deepseek-ai/DeepSeek-V4-Flash-0731',
    'zai-org/GLM-5.3-Flash', // modèle de raisonnement
  ],
})

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

  return toServerSentEventsResponse(stream)
}

Client React via le hook useChat — streame les réponses du serveur vers l'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('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 identique pour toutes les variantes.

Paramètres des modèles via Gateway : contexte — 200K jetons pour MiniMax M2.7, 380K pour DeepSeek V4 Flash et 390K pour GLM-5.3 Flash. La limite max_tokens est de 8192 pour MiniMax M2.7 et GLM-5.3 Flash, et 32768 pour DeepSeek V4 Flash. Si max_tokens n'est pas spécifié, la valeur par défaut pour le non-stream est de 1500 ; pour les longues réponses, définissez-la explicitement.

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

L'approche agnostique aux fournisseurs de TanStack AI signifie que passer à Gonka ne nécessite qu'une seule ligne (baseURL), pas une réécriture du 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 représente des dizaines de milliers de dollars par mois.

Prix Gonka : entrée ~$0.0069 pour 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 caractéristique principale de TanStack AI est son contrat unique toolDefinition() : l'outil est décrit une seule fois (entrée/sortie via Zod, ArkType, Valibot ou JSON Schema), et l'implémentation est liée côté serveur ou client. MiniMax M2.7, DeepSeek V4 Flash et GLM-5.3 Flash prennent en charge le tool calling natif via Gonka, de sorte que les agents fonctionnent de manière fiable — sans parsing de réponses textuelles.

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 appel API réel
})

const stream = chat({
  adapter: gonka('MiniMaxAI/MiniMax-M2.7'),
  messages: [{ role: 'user', content: 'Quel temps fait-il à Moscou ?' }],
  tools: [getWeather],
  modelOptions: { max_tokens: 8192 },
})

Quel modèle choisir :

• MiniMaxAI/MiniMax-M2.7 — par défaut, équilibre entre vitesse et qualité, long contexte. Limite de réponse 8192.
• deepseek-ai/DeepSeek-V4-Flash-0731 — l'un des contextes les plus longs du réseau (380K), grands prompts économiques. Limite de réponse 32768.
• zai-org/GLM-5.3-Flash — modèle de raisonnement : réfléchit avant de répondre, solide sur la logique complexe ; le plus long contexte du réseau (390K). Limite de réponse 8192 ; le raisonnement consomme une partie des max_tokens.

Grâce au runtime adapter switching dans TanStack AI, vous pouvez conserver les trois modèles au sein d'un même fournisseur et basculer entre eux à la volée — par exemple, les tâches de raisonnement sur GLM-5.3 Flash, les réponses rapides sur MiniMax.