// data & ai · giornale tecnico MILANO ● LIVE 00:00:00

Mermaid convertito in ASCII art, tutto nel browser via WebAssembly

Simon Willison ha compilato in WebAssembly la libreria Go mermaid-ascii: sintassi Mermaid dentro, box-drawing ASCII e Unicode fuori, senza che nulla esca dal browser.

Simon Willison ha pubblicato un piccolo tool che converte la sintassi dei diagrammi Mermaid in ASCII art e box-drawing Unicode, renderizzato interamente nel browser tramite una libreria Go compilata in WebAssembly.

Supporta flowchart con etichette sugli archi, subgraph e definizioni di colore, oltre a sequence diagram con note e frammenti di controllo di flusso. Padding e opzioni di output sono configurabili.

La storia dietro

Willison racconta di aver prima costruito un tool Mermaid-to-ASCII basato sul codice Rust di Grok Build, e di aver poi scoperto l’esistenza di una libreria Go più vecchia e più completa, AlexanderGrooff/mermaid-ascii, che implementa un pattern simile. Ha quindi fatto compilare anche quella in WebAssembly per confrontare i due risultati. Questa versione, a differenza della prima, supporta i colori.

Perché interessa chi lavora con i dati

Il caso d’uso non è estetico. Un diagramma ASCII vive dove un PNG non arriva: dentro un docstring, in un commento SQL sopra un modello dbt, nel README di un repo letto da terminale, in un messaggio di commit, nell’output di un job. Sopravvive al diff di Git in modo leggibile, non richiede un tool esterno per essere aperto e non si rompe quando qualcuno sposta la cartella delle immagini.

Per documentare un DAG di trasformazioni o il flusso di una pipeline, avere la stessa fonte Mermaid che genera sia il diagramma renderizzato per la wiki sia la versione ASCII da incollare nel codice riduce il classico problema della documentazione che diverge dal repo.

Il dettaglio architetturale rilevante è che il rendering avviene interamente nel browser: la libreria è compilata in WebAssembly, quindi il contenuto del diagramma non viene inviato da nessuna parte. Per chi lavora in contesti dove anche i nomi delle tabelle sono informazione sensibile, è la differenza tra usare il tool e non poterlo usare.

In sintesi

  • Sintassi Mermaid dentro, ASCII e box-drawing Unicode fuori, con supporto ai colori e a flowchart e sequence diagram.
  • Rendering interamente client-side via WebAssembly: nessun contenuto del diagramma lascia il browser.
  • Utile dove un’immagine non arriva: docstring, commenti SQL, README da terminale, output di job.

Fonte: Tool: Mermaid to ASCII art (mermaid-ascii) — https://simonwillison.net/2026/Jul/16/mermaid-ascii/

Condividi X Facebook LinkedIn WhatsApp Email

// scritto da

Fernando

Hai qualcosa da aggiungere? Unisciti alla discussione.

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Altri dell'autore

dalla stessa firma