# Simon Willison 将 Grok CLI 中的 Mermaid 渲染器编译为 WebAssembly，在浏览器中实现 Mermaid 图的 Unicode 框图渲染，展示了 Rust 代码的 Web 端复用

- 来源：Simon Willison
- 发布时间：2026-07-16 08:33
- AIWatch 分数：52
- AIWatch 标记：未精选
- AIWatch 链接：https://aiwatch.icu/events/evt_01kxzh0bwahm1m6tw9zv9947mv
- 原文链接：https://simonwillison.net/2026/Jul/16/grok-mermaid/#atom-everything

## 精选理由

常规快讯，保留列表

## AI 摘要

Simon Willison 将 Grok CLI 中的 Mermaid 渲染器编译为 WebAssembly，在浏览器中实现 Mermaid 图的 Unicode 框图渲染，展示了 Rust 代码的 Web 端复用。

## 正文

Tool: Mermaid to Unicode box art (grok-mermaid)

While exploring the codebase for the newly open-sourced Grok CLI coding agent I came across xai-grok-markdown/src/mermaid.rs, a "self-contained terminal renderer for Mermaid diagrams" written in Rust.

I figured it would be fun to try that out in a browser via WebAssembly. Here's the prompt I ran in Claude Code for web (Fable 5), and this is what the resulting tool looks like:

Screenshot of a Mermaid diagram editor showing source code and rendered flowchart. The code reads: graph TD Start[Request received] --> Auth{Authenticated?} Auth -->|yes| Rate{Rate limit OK?} Auth -->|no| R401[401 Unauthorized] Rate -->|yes| H(Handle request) Rate -->|no| R429[429 Too Many Requests] H -.-> Log[Audit log] H ==> Resp[200 OK]. Below the code are controls labeled Max width: Fit output

Tags: tools, rust, webassembly, mermaid, grok, xai