Comprendre le streaming LLM en TypeScript

Voir arriver une réponse au lieu de l’attendre

Avec invoke, votre application reçoit une réponse complète. Avec stream, elle peut consommer les morceaux au fil de leur arrivée et afficher une progression. Cela peut améliorer l’attente perçue, sans garantir une génération totale plus rapide.

Nous allons d’abord assembler un flux local dont les morceaux sont connus. Il est simulé : aucun LLM distant n’est appelé. Vous pourrez vérifier votre boucle avant d’ajouter la variabilité, les erreurs réseau et la facturation d’un fournisseur.

Reproduire le flux local

Avec Node.js 22 ou plus récent, téléchargez les exemples, décompressez le dossier et lancez :

npm ci
npm run stream

Le programme stream-demo.mts utilise @langchain/core 1.2.14 et son modèle de test FakeStreamingChatModel. La fixture fournit les contenus "Bon", "jour, ", "" et "monde !". Ce découpage est choisi pour l’explication, pas produit par un tokenizer.

La boucle qui vous intéresse

const stream = await model.stream("Entrée de la fixture locale");
let text = "";
let chunks = 0;

for await (const chunk of stream) {
  chunks += 1;
  const addition = chunk.text;
  text += addition;
  console.log(`Chunk ${chunks} : ${JSON.stringify(addition)}`);
}

for await attend le prochain morceau sans exiger que la réponse soit complète. chunk.text récupère la partie textuelle dans cette version du SDK. Une arrivée sans texte n’ajoute rien à l’affichage ; elle ne prouve pas que le flux est terminé.

En sortie, vous devez lire :

Chunk 1 : "Bon"
Chunk 2 : "jour, "
Chunk 3 : ""
Chunk 4 : "monde !"
Texte assemblé : Bonjour, monde !
4 chunks ne prouvent pas 4 tokens ; ce découpage est simulé.

Le programme vérifie le texte final et le nombre de morceaux de cette fixture. À vous : changez leur répartition tout en gardant la même phrase, puis adaptez seulement l’assertion du compteur. Pourquoi le texte final ne change-t-il pas ?

Chunk, token et document : trois choses différentes

Un token est une unité utilisée par le modèle. Un chunk de streaming est un objet reçu par votre programme ; son contenu peut être du texte, des métadonnées ou des fragments d’appel d’outil. Ne déduisez pas la consommation de tokens en comptant ces objets.

Découper un document pour une recherche RAG répond à une autre question : comment organiser le corpus à indexer. Ce découpage n’est pas la boucle qui affiche une réponse progressive.

Notre boucle assemble uniquement le texte. Elle ne reconstruit pas les appels d’outils, les contenus multimodaux ou les métriques d’usage. Pour ces cas, traitez les structures prévues par le fournisseur et le SDK.

Passer à un fournisseur, quand votre boucle est comprise

Le fichier optionnel stream-real.mts utilise @langchain/openai 1.6.2 avec ChatOpenAI. Il exige OPENAI_API_KEY et OPENAI_MODEL côté serveur. Vous choisissez un modèle disponible sur votre compte ; l’appel peut être facturé. Ne mettez jamais votre clé dans un composant navigateur ou un dépôt public.

Ce script n’est pas exécuté par npm test et aucun appel payant n’a été effectué pour valider ce guide. Sa sortie dépend du modèle, du compte et du réseau. Si vous l’utilisez, lancez-le dans un terminal serveur après avoir configuré ces deux variables :

npx tsx stream-real.mts

Votre interface doit encore annoncer les erreurs et la fin du flux, permettre une interruption et éviter de rendre du HTML arbitraire généré par le modèle. Une annulation ne garantit pas qu’aucun token déjà généré sera facturé.

Source de référence : modèles et streaming LangChain. Le premier graphe vous montre ensuite où placer cet appel dans un parcours organisé.