Simon Willison が Mermaid 用 ASCII 変換ツール公開
Simon Willison は、既存の Go ライブラリを WebAssembly にコンパイルし、色対応を含む高機能な Mermaid ダイアグラムから ASCII アートへの変換ツールを公開した。
キーポイント
WebAssembly を活用した高機能変換ツールの実装
Simon Willison は、既存の Go ライブラリ(AlexanderGrooff/mermaid-ascii)を Claude Fable 5 を用いて WebAssembly にコンパイルし、ブラウザ上で動作するツールとして公開しました。
カラー対応による視覚情報の保持
従来の ASCII アート変換ツールにはなかった「色」のサポートが実装されており、Mermaid 図のステータス(成功、警告、失敗など)を色の違いで表現できます。
複数のライブラリ比較による最適化
著者はまず Grok Build の Rust コードベースのツールを作成しましたが、より機能豊富な Go ライブラリを見出し、両者を比較検討した上で最終的な実装に至りました。
重要な引用
I had Claude Fable 5 compile that one to WebAssembly as well so I could compare the two.
This one includes support for colors!
A control row shows an unchecked 'ASCII only' checkbox, 'Padding X: 5', 'Padding Y: 5', 'Box padding: 1'
影響分析・編集コメントを表示
影響分析
このツールは、ドキュメント作成やチャットコミュニケーションにおいて、Mermaid で作成した複雑な図表を、画像ファイルに依存せずテキストベースで共有する際の利便性を大幅に向上させます。特にカラー情報の保持により、単なる線画ではなく、ステータスや重要性といった文脈情報も伝達可能になるため、技術ドキュメントのアクセシビリティと効率性が改善されます。
編集コメント
この発表は、LLM を単なる生成ツールとしてだけでなく、既存の技術スタック(Go ライブラリ)を現代的な環境(WebAssembly)へ適応させるための「変換・最適化エンジン」として活用する事例を示しています。特にカラー情報を ASCII 形式でどう表現するかという課題への解決策は、テキストベースのコミュニケーションにおける情報伝達精度を高める重要な一歩と言えます。
ツール: Mermaid to ASCII art (mermaid-ascii)
Grok Build の Rust コード をベースに Mermaid から ASCII アートへ変換するツールを作成した後、より機能が充実した Go ライブラリ AlexanderGrooff/mermaid-ascii があることを知りました。同様の仕組みを採用しているこのライブラリも WebAssembly にコンパイルして比較してみました。
今回のツールでは、色対応にも成功しています!
Test:::good / Test --> Deploy:::warn / Deploy --> Rollback:::bad / classDef good color:#3fb950 / classDef warn color:#e3b341 / classDef bad color:#ff7b72
コントロール行には、チェックボックスの「ASCII only(ASCII 形式のみ)」、パディング設定の「Padding X: 5」「Padding Y: 5」「Box padding: 1」、そして「テキストとしてコピー」ボタンと「この図へのリンクをコピー」ボタンが配置されています。黒背景の下部には、左から右へ流れるフローチャートが表示されており、「Build(緑色)」「Test(緑色)」「Deploy(黄色)」「Rollback(赤色)」という 4 つのボックスが矢印でつながれています。
Tags: go, tools, webassembly, mermaid
原文を表示
Tool: Mermaid to ASCII art (mermaid-ascii)
After building the Mermaid to ASCII tool based on Grok Build's Rust code I learned that there's an older, more fully-featured Go library called AlexanderGrooff/mermaid-ascii that implements a similar pattern, so I had Claude Fable 5 compile that one to WebAssembly as well so I could compare the two.
This one includes support for colors!
Test:::good / Test --> Deploy:::warn / Deploy --> Rollback:::bad / classDef good color:#3fb950 / classDef warn color:#e3b341 / classDef bad color:#ff7b72". A control row shows an unchecked "ASCII only" checkbox, "Padding X: 5", "Padding Y: 5", "Box padding: 1", and buttons "Copy as text" and "Copy link to this diagram". At the bottom on a black background is the rendered left-to-right flowchart with four connected boxes: "Build" (green text), "Test" (green text), "Deploy" (yellow text), "Rollback" (red text), each linked by arrows." src="https://static.simonwillison.net/static/2026/mermaid-ascii.webp" />
Tags: go, tools, webassembly, mermaid
関連記事
今日のまとめ
AI日報で今日の重要ニュースをまとめ読み