用 Mermaid 给 AI 输出图表，结果频繁踩坑，官方渲染器依赖 DOM，在 Node.js 环境里直接报错，换成异步方案又没法用在 useMemo() 里，流程图和时序图卡了整整一天 我试了 beautiful-mermaid，零 DOM 依赖，同步渲染，直接塞进 useMemo() 一行搞定 GitHub： 支持流程图、状态机、时序、类图、ER 图、XY 图共 6 种类型 双模式输出：SVG 用于 Web 界面，ASCII/Unicode 用于终端和 AI 上下文 内置 15 套主题，Shiki/VS Code 主题可直接导入，100 张图 500ms 内渲染完 在 AI 应用里渲染图表，你现在用的是什么方案？有没有遇到异步渲染导致竞态的问题？

让 AI 画图，别再要 Mermaid 那种圆角方框了 🎨 diagram-design：一个 agent skill，一句话让 Claude Code / Codex / Cursor 直接画出一个自包含的 HTML + SVG 图。45 种图型，架构图、时序图、桑基图、爆炸轴测图都有。 审美被写成了规则：全图只用一个强调色，没有阴影，所有坐标都能被 4 整除。给它你的网站链接，它还能自动提取配色和字体。 npx skills add cathrynlavery/diagram-design

Grok CLI 现在可以直接在终端里画 Mermaid 图了。 这个更新看起来不大，但对开发流程非常实用。以后让它分析项目、拆解 Agent 工作流、梳理数据库关系或者解释代码逻辑，可以顺手生成流程图，不用再复制到其他网站渲染。 下一步大概就是读完整个代码库，自动给你画系统架构图了。

陆地版美人鱼，尾巴用黑丝做成。 Land mermaid edition.Tail made of black stockings. #黑丝# #丝足# #黑丝美腿# 👧:@wenwen0006 📷:@Lipsphoto66 📧:@Fengsiyuan @XXman61101766 @XWANWU

庆祝 ColaMD 突破 1000 stars 🎉 特别发布重大版本 2.0.0！ Mermaid 支持+多窗口+自定义字体+自动保存... 从一个优雅的轻量 md 阅读器，晋升为一个可以持续稳定运行的 md 编辑器。 不知不觉，这个小小的 markdown 编辑器项目已经突破 1000 stars 了，这本来只是我换电脑的时候发现没有一个免费的 md 编辑不方便所做的小工具，但在发布之后，得到了超过 1500 名用户的安装和喜爱。 （当然还有很多很多的吐槽和 issue，特别对因为之前没加自动保存而让某位编辑了一天忘记保存而丢掉的兄弟，很抱歉也很感谢） 虽然它最初的定位是极简，极小，以方便我这样完全不会编程的人能维护好，但随着口口相传，它的用户传播超出了它的产品边界，功能越来越多，也能满足越来越多用户的需求。 好在这半年，AI coding 能力也在越来越强，每次有新模型上线，我都会用来推进一个版本。 有几个很难做的功能，在 2.0.0 也都啃下来了，在此感谢 ox 和 terra 两个模型。 我还尝试做了 iOS 版本，开发难度更胜 Mac，不过也啃下来了。 在 stars 通货膨胀的今天，1000 stars 不多，但对一个编程小白来说，也不是一个很重要的里程碑。 更让人有成就感的事情，是看到有真实的 1500 次下载。 现在看它越来越好，期待明年能突破一万用户！ 下载地址： 支持 Mac Win Linux iOS（需要自己打包）

🚀发现一个专门给 AI Agent 画技术架构图的 Skill：Archify。 不用学 Mermaid，也不用手动拖框拉线。直接用大白话告诉 Claude Code / Codex： “读一下这几个仓库，帮我画张架构对比图。” 它就会生成一个可交互的单 HTML 文件。 比较讲究的是，它不是画完就交差： ✅ 自带 JSON Schema 校验 ✅ 标签重叠、连线穿过节点会拒绝渲染 ✅ 报错会告诉你该往哪移、调整多少像素 ✅ 一键切换深色/浅色主题 ✅ 支持导出 PNG、JPEG、WebP、SVG、WebM 支持 Claude Code、Codex CLI 和 opencode，MIT 开源。 安装也只要一行： npx skills add tt-a1i/archify -g 以后读陌生仓库、写技术方案、做架构对比，确实能省下不少画图时间。 传送门👉🏻

xAI 开源的 Grok CLI 代码库里，藏着一个实用的小工具，可以把 Mermaid 图直接渲染成终端风格的 Unicode 框图。 这段 Rust 代码通过 fable 5 编译成了 WebAssembly，现在打开浏览器就能运行。 流程图、时序图、状态图、类图和 ER 图都支持，还能调整宽度、复制文本、生成分享链接。

📒 撞见一套开源工程手册 engineering-handbook，系统设计和算法两门硬课一次给全。 它的分量是这么写的：系统设计册 159 个章节分 12 个部分，外加 22 页专讲权衡的页面，约 773,000 字、719 张 Mermaid 图、三千一百多条引用；算法册 120 个章节，155 道 LeetCode 题配了 Python、Java、C++、Go 四种语言的代码。 准备系统设计面试的人大概都这么干过：收藏夹里塞满博客和视频，看完一圈还是答不上来「这里为什么选这个组件」。engineering-handbook 把路径摊平了——第 8 部分是 56 个端到端的设计案例，短链、聊天、支付一路到 AI 系统；第 9 部分专门讲 AI 与机器学习系统，LLM 服务、RAG、向量搜索、多 agent 编排一共 15 章。算法册那边还有 37 页模式决策页和 46 个交互式组件的规格说明。 内容就放在仓库的 content 目录下，Markdown 写的，仓库挂了 CI 做质量检查，每章前面都标着创建和更新日期。两本手册各有一个在线阅读的站点，算法册那个目前还标着公开测试版。 许可是 CC BY-SA 4.0，这种体量白送出来，收藏夹总算能清一清了。 GitHub：