Transformer Explainer : faire tourner GPT-2 dans l'onglet pour voir l'attention en direct

Un problème de salle de cours, pas de salle serveur

Lire la définition mathématique d'une tête d'attention ne dit rien de ce qui se passe quand on tape une phrase. Les cours sur les LLM se heurtent à un mur pratique : pour observer les tenseurs intermédiaires, il faut installer une chaîne Python, télécharger des poids, écrire un hook dans un framework, puis deviner quelle dimension correspond à quoi. Transformer Explainer prend le problème par l'autre bout. Le README annonce un outil qui « runs a live GPT-2 model right in your browser » et permet de saisir son propre texte pour voir, en temps réel, comment les composants internes collaborent pour prédire les tokens suivants. Le public visé est donc l'étudiant, l'enseignant, ou l'ingénieur qui a déjà lu un schéma de transformer et veut le voir bouger. Ce n'est pas un outil d'observabilité pour modèles en production, et le dépôt ne prétend pas le contraire.

GPT-2 côté client : ce que le dépôt laisse voir de l'architecture

Le point technique qui distingue ce projet de la plupart des visualiseurs de transformers est l'absence de backend d'inférence. Le README insiste : le modèle tourne dans le navigateur. Aucune API distante n'est appelée pour calculer les activations, ce qui signifie que les poids de GPT-2 doivent être chargés côté client et que la passe avant s'exécute dans la page. Le dépôt est classé en JavaScript, et sa pile de développement repose sur Vite, comme l'indique la commande npm run dev et le port 5173 par défaut. La séparation entre le moteur d'inférence et la couche de rendu est une contrainte de conception, pas un détail : un modèle de plusieurs centaines de mégaoctets ne peut pas être manipulé comme un tableau JavaScript ordinaire, et l'interface doit rester réactive pendant que le calcul progresse. Le README ne détaille pas l'implémentation du moteur, ni s'il repose sur WebGPU, WebAssembly ou une bibliothèque existante. Sur ce point précis, la documentation est muette et il faut lire le code source pour trancher.

Installation locale : quatre commandes et deux prérequis

La procédure locale tient en quatre lignes, reproduites telles quelles depuis le README : git clone https://github.com/poloclub/transformer-explainer.git, puis cd transformer-explainer, npm install, npm run dev. L'accès se fait ensuite sur http://localhost:5173. Les prérequis sont explicites : Node.js v20 ou supérieur et NPM v10 ou supérieur. Ce seuil n'est pas anodin, Node 18 est encore répandu sur les machines d'entreprise et Vite récent refuse de démarrer en dessous. Aucune variable d'environnement, aucun fichier de configuration, aucune clé d'API n'est mentionnée. C'est cohérent avec le choix d'un modèle embarqué : il n'y a rien à authentifier. Pour une démonstration en amphithéâtre, cette absence de configuration est l'argument principal. Pour un déploiement interne, elle devient un problème de taille de bundle, car les poids doivent être servis depuis quelque part.

La limite que le README ne cache pas : un seul modèle

Le projet est construit autour de GPT-2. Le README parle de « Transformer-based models like GPT » dans l'introduction, mais l'implémentation annoncée est bien GPT-2, et rien n'indique qu'un autre modèle puisse être substitué par configuration. Concrètement, cela veut dire que les mécanismes spécifiques aux architectures plus récentes ne sont pas couverts : pas de rotary position embeddings, pas de grouped-query attention, pas de mixture of experts. Un enseignant qui veut expliquer pourquoi Llama ou Mistral se comportent différemment devra compléter avec autre chose. Il y a une seconde limite, moins visible : la taille du contexte. GPT-2 a une fenêtre limitée, et l'interface invite à saisir du texte libre. Passé une certaine longueur d'entrée, le rendu des matrices d'attention devient illisible avant même que le modèle ne sature. L'outil est donc meilleur sur des phrases courtes que sur des paragraphes, ce qui est une contrainte pédagogique réelle, pas un défaut d'implémentation.

Ce qui existe à côté, et en quoi c'est différent

Le README renvoie lui-même vers trois projets voisins du même laboratoire : Diffusion Explainer, CNN Explainer et GAN Lab. La comparaison la plus utile est avec CNN Explainer. Ce dernier illustre un réseau convolutif, où l'information circule dans une seule direction à travers des couches de taille décroissante, et où l'unité d'analyse est une carte de caractéristiques. Un transformer n'a pas cette structure : chaque token entretient une relation pondérée avec tous les autres à chaque couche, et c'est précisément cette matrice de poids que Transformer Explainer doit rendre lisible. La différence d'approche est donc structurelle, pas cosmétique. CNN Explainer peut afficher une grille d'images intermédiaires ; Transformer Explainer doit afficher des relations entre positions, ce qui impose un autre vocabulaire visuel et une autre navigation. Pour quiconque a déjà utilisé CNN Explainer, le passage à ce projet demande un réapprentissage de l'interface.

Maintenance, versions et implications de la licence MIT

Le dépôt n'est pas archivé et le dernier push date du 6 juin 2026. Une seule release est publiée, la v0.0.1 du 11 juin 2024. Ce déséquilibre entre activité de développement et publication de versions signifie qu'il n'existe pas de canal de distribution stable : on clone la branche main, on ne dépend pas d'un paquet versionné. Pour un usage en cours, c'est acceptable. Pour intégrer le visualiseur dans une plateforme d'enseignement avec des builds reproductibles, c'est un point de friction à anticiper, car rien ne garantit que la branche main reste compatible avec votre environnement Node d'une session à l'autre. Le projet est publié sous licence MIT, ce qui autorise la réutilisation, la modification et la redistribution, y compris dans un cadre commercial, à condition de conserver l'avis de copyright. Cette licence couvre le logiciel du dépôt. Elle ne couvre pas les poids de GPT-2 eux-mêmes, qui proviennent d'un dépôt distinct et dont les conditions d'utilisation sont fixées par leur propre licence. C'est la vérification à faire avant tout déploiement public, et elle ne relève pas du code de ce projet.

Ce que la publication CHI apporte, et ce qu'elle n'apporte pas

Le README cite un article accepté à la conférence CHI 2026, signé par neuf auteurs de Georgia Tech, avec un identifiant arXiv 2408.04619. Cette publication est le principal signal de sérieux méthodologique du projet : elle suggère que l'outil a été évalué, et pas seulement construit. Mais un article de conférence ne documente pas la maintenance. Il ne dit rien non plus sur la compatibilité navigateur, sur les performances selon le matériel, ni sur la stratégie de mise à jour du modèle. Un lecteur qui cherche à savoir si l'outil tiendra dans un cursus sur trois ans n'aura pas de réponse dans le README. La seule façon de se prononcer est de cloner le dépôt, de lancer npm run dev, et d'observer soi-même le comportement sur la machine cible.

Conclusion éditoriale

À adopter si vous enseignez les transformers ou si vous voulez montrer à un collègue ce qui se passe entre l'entrée et le softmax final, sans installer PyTorch. À éviter si vous cherchez un outil de débogage de modèle en production ou si vous devez expliquer un modèle différent de GPT-2. Avant de cloner, vérifiez deux choses concrètes : que votre poste satisfait Node.js v20 et NPM v10, et que le navigateur cible autorise les Web Workers, car tout le calcul d'inférence s'y déroule.

Sources officielles

1. License: MIT
2. poloclub/transformer-explainer on GitHub
3. Project website
4. README
5. Releases