veilletech.fr
27 sept. Feed du jour
#07 OUTILS Article

Reladraw : des diagrammes placés par des phrases

Le schéma se modifie comme on corrige une phrase.

Reladraw est un langage de diagrammes où l'on énonce la position de chaque élément par rapport aux autres, sans coordonnées ni placement automatique. Le moteur en déduit la disposition la plus compacte, de façon déterministe. Il est pensé pour que les agents de code modifient un schéma en réécrivant une phrase ; version 0.8, syntaxe encore instable.

3 min de lectureintermédiairevidéo 1:21
Partager
Sommaire7 sections
  1. Ce qui se passe
  2. Le manque qu'il vise
  3. Comment ça s'écrit
  4. Le moteur
  5. Pour les agents
  6. Les limites
  7. À retenir

Ce qui se passe

Reladraw, présenté sur Hacker News le 26 septembre, est un langage texte pour les diagrammes où l'auteur décide de la disposition sans jamais écrire une coordonnée. Version 0.8.0 : parseur, résolveur et rendu SVG en TypeScript, sans dépendance à l'exécution, sous licence Apache-2.0.

Le manque qu'il vise

Mermaid, Graphviz et D2 prennent les entités et les liens, puis placent tout eux-mêmes. Très bien, jusqu'au moment où l'on a une image précise en tête. À l'autre bout, draw.io, Excalidraw ou Figma donnent un contrôle total, mais chaque retouche d'un grand schéma se fait à la main — et coûte cher à un agent, qui doit reconstituer l'image à partir des coordonnées avant de savoir lesquelles changer.

Comment ça s'écrit

Chaque position est énoncée par rapport à un autre élément, une instruction par ligne, sans imbrication. Esquisse d'après la syntaxe documentée :

TEXT
node web "Front"
node api "API"       below web
node db  "Postgres"  right of api  level with api

edge api -> db  "requêtes"  from: right  to: left

La syntaxe est un brouillon, dans SYNTAX.md, et l'auteur prévient qu'elle changera.

Le moteur

Chaque écart est une distance minimale, jamais exacte. Le résolveur cherche, axe par axe, la disposition la plus serrée qui respecte toutes les contraintes, par un calcul de plus longs chemins : une seule solution, sans recherche ni essai. Insérer un élément entre deux autres les écarte d'exactement ce qu'il faut ; le retirer les rapproche.

Les nœuds ne se chevauchent pas par défaut : le sens de séparation se déduit de la disposition écrite. Si le fichier ne dit rien d'une paire, l'outil la nomme au lieu de deviner. Principe affiché : le moteur décide des distances, jamais des relations.

Pour les agents

Modifier le schéma revient à modifier la phrase qui place l'élément. Un agent peut relire son fichier et confirmer ce qu'il voulait ; il ne voit pas un chevauchement ou un texte qui déborde. C'est le rôle du rapport de diagnostic prévu (hub overlaps laptop1, edge auth->db crosses 4 edges), qui n'existe pas encore.

Le dépôt fournit une skill en Markdown pour Claude Code, Codex, Cursor ou Copilot, et l'outil en ligne de commande :

Terminal
npx skills add reladraw/reladraw -g                  # tous les agents
npx skills add reladraw/reladraw -g -a claude-code   # un seul
npm install -g reladraw
reladraw diagram.reladraw -o diagram.svg

La skill est une copie : la réinstaller après une version qui change la syntaxe.

Les limites

Source : reladraw/reladraw, GitHub, présenté sur Hacker News le 26 septembre 2026.