首页 › new-tools › AI画图终于能看了:Flint今日开源

AI 出活的"最后一公里",这一周被悄悄补上了

如果你过去一年让 GPT 或 Claude 帮你画过图表,大概率经历过这个画面:模型直接吐给你一大坨 ECharts 或 Vega-Lite 的 JSON 配置,跑起来要么报错、要么丑得不想发出去。你以为"AI 画图"的天花板就这样了。但就在今天(2026 年 7 月 8 日),微软研究院开源了一个叫 Flint 的东西,把这个天花板掀了。与此同时,HN 上一个本地优先的代码库可视化工具 Onboard-CLI,和 xAI 的 Grok Build + Agent Client Protocol,也凑成了这一周最值得讲、但国内几乎没人提的三件新事。

本文要给你的信息差只有一个:AI 的"出活质量"——画图、读懂老代码、跑工程流水线——正在被三个新东西重新定义,而它们今天就能用。


一、Flint:让 AI 写"人话",它替你编译成精美图表

官方链接:项目站 microsoft.github.io/flint-chart | 仓库 github.com/microsoft/flint-chart | npm flint-chart + flint-chart-mcp

发布时间:2026-07-08(Microsoft Research 官方博客同步发布)

它到底是什么

Flint 全称是"AI 时代的可视化语言"(A Visualization Language for the AI Era)。但别被"语言"两个字吓到——它本质上是一个可视化的中间表示(Intermediate Language, IL)。

一句话讲清它解决的痛点:直接让 LLM 写图表配置,规格短了出图平庸,规格长了模型容易写崩。 Flint 的思路是把"写配置"这一步从模型手里拿走——模型只需要写一段简短的、语义化的 Flint 描述,Flint 编译器再把它翻译成精美的最终图表。

它的硬参数:

为什么这个信息差值钱

国内做 AI 应用的团队,绝大多数还在走两条老路:要么让模型直出 ECharts/G2Plot 的配置 JSON(丑且易错),要么接一个"拖拽式图表工具"给终端用户。Flint 踩的是中间那条几乎没人走的路——把"语义层"和"渲染层"解耦。 模型只管懂你要什么,编译的脏活累活交给 Flint。这意味着:

它的工作原理

flowchart LR
    U["你的需求<br/>画一张各产品线销售额对比图"] --> LLM["LLM / AI Agent"]
    LLM -->|"写一段简短 Flint 语义描述"| F["Flint 中间语言 IL"]
    F -->|"编译"| R{"渲染引擎三选一<br/>或多选"}
    R --> VL["Vega-Lite"]
    R --> EC["ECharts"]
    R --> CJ["Chart.js"]
    VL --> Chart["46 种精美图表<br/>稳定可复现"]
    EC --> Chart
    CJ --> Chart
    style F fill:#fff3cd,stroke:#d39e00,stroke-width:2px
    style Chart fill:#d4edda,stroke:#28a745,stroke-width:2px

适用人群

做 AI 应用 / Agent 产品的开发者、数据分析师、需要在 SaaS 里让用户"一句话生成报表"的团队、所有被"AI 出的图太丑"折磨过的人。接 MCP server 大约 5 分钟,今天就能在 Claude Code 里试出来。


二、Onboard-CLI:用 AST 离线把代码库变成图谱,再喂给 AI

官方链接:github.com/animesh-94/Onboard-CLI | 演示站 onboard-cli.vercel.app | HN 帖 news.ycombinator.com/item?id=48836813

作者:animesh-94(个人开源)| 协议:MIT

它到底是什么

Onboard-CLI 是一个 AST 驱动、本地优先(local-first)的 CLI + Web 可视化平台,用 Go 1.21+ 写后端、React 19 做前端,核心引擎是 Tree-sitter 做语法树解析。它把任意代码库解析成一张可查询的节点关系图谱,支持画布式(canvas)节点拖拽可视化,还能检测架构漂移(architectural drift)——也就是代码实际结构跟它"应有的架构"之间悄悄偏离了多少。

为什么这个信息差值钱

国内开发者让 AI 读代码库,90% 还在用最笨的办法:把文件一股脑塞进上下文窗口。结果是 token 烧得飞快、长上下文模型还容易"读着读着忘前面"。Onboard-CLI 给了一条更聪明的路:

  1. 离线先建图:AST 解析在本地跑,不联网、代码不上传——这点对有代码合规要求的中国团队是硬刚需;
  2. 喂给 AI 的是"结构"而非"原文":图谱化的调用关系、模块依赖,比一坨源码更省 token、AI 理解更准;
  3. 可视化先于提问:人在向 AI 提问前,自己先在 canvas 上看清"谁调用谁、哪里是孤岛",提问质量自然上去。

同类还有 codegraph,思路接近。对比国内的 Sourcegraph 或直接靠模型硬读,Onboard-CLI 胜在"本地优先 + AST 结构化"这两个点。 适合接手老项目、做代码审计/重构、大团队新人 onboarding 的场景。


三、Grok Build + Agent Client Protocol:编码 agent 的第三极,和它的"通信标准"

官方链接:x.ai/news/grok-build-cli | 完整指南 aimadetools.com/blog/grok-build-complete-guide

发布时间:2026 年 6 月初进入 beta

它到底是什么

xAI 终于正式下场做终端编码 agent 了。Grok Build 是一个 TUI(终端界面)多 agent 编码工具,对标 Claude Code 和 Codex CLI。它的底层模型是 grok-build-0.1:256K 上下文窗口,API 定价 输入 \$1 / 输出 \$2 per 1M token,1800 RPM;beta 期间对 SuperGrok 和 X Premium Plus 订阅者免费开放。

几个真有看点的工程特性:

真正的信息差:Agent Client Protocol(ACP)

Grok Build 最值得讲的不是它自己,而是它原生支持的 Agent Client Protocol(ACP)。

打个比方你就懂:MCP 解决的是"agent 怎么调用外部工具",ACP 解决的是"agent 之间怎么对话、怎么协作"。 以前你让多个 agent 协作,基本靠在一个 prompt 里硬串、或者自己手搓胶水代码;ACP 想把这件事标准化——不同厂商的 agent、不同框架的 agent,理论上能按同一个协议互相派活、互相对账。

对中国开发者的启示:当你开始做多 agent 系统(比如"研究员 agent + 编码 agent + 测试 agent"流水线),与其自己发明协作格式,不如盯紧 ACP 这种正在成型的标准。这是继 MCP 之后,agent 生态里第二个值得提前卡位的协议层。

flowchart TB
    subgraph 理解层["理解层 · 读旧代码"]
      O["Onboard-CLI<br/>AST 离线建图 → 结构喂 AI"]
    end
    subgraph 表达层["表达层 · 出活好看"]
      Fl["Flint<br/>语义描述 → 46 种精美图表"]
    end
    subgraph 工程层["工程层 · 跑流水线"]
      G["Grok Build + ACP<br/>并行子agent · CI · agent互联"]
    end
    Code["你的代码库 / 需求"] --> O
    O --> AI["AI / Agent"]
    AI --> Fl
    AI --> G
    style Fl fill:#fff3cd,stroke:#d39e00,stroke-width:2px
    style G fill:#d1ecf1,stroke:#17a2b8,stroke-width:2px
    style O fill:#f8d7da,stroke:#dc3545,stroke-width:2px

信息差总结:你知道的 vs 别人已经知道的

环节 多数人还在做的(你知道的) 这一周的新解法(信息差)
AI 画图 让模型直出 ECharts/Vega-Lite 配置,丑且易崩 Flint:模型只写语义描述,编译成 46 种图表、三引擎通用
AI 读代码库 把源码全塞进上下文,烧 token 又忘事 Onboard-CLI:AST 本地离线建图,喂结构不喂原文,代码不出本机
多 agent 协作 在一个 prompt 里硬串 / 手搓胶水 Grok Build + ACP:agent 间通信标准化,8 并行子agent,原生复用 MCP
编码 agent 选择 Claude Code / Codex 二选一 多了 Grok Build:\$1/\$2 定价、256K、CI headless

行动指南:今晚就能做的三件事

  1. 5 分钟试 Flint:在 Claude Code 里装 flint-chart-mcp,让它画一张你最近项目的数据图,对比一下直出 ECharts 的效果。这是感知"语义层 vs 配置层"差异最快的方式。
  2. 拿一个老仓库跑 Onboard-CLI:本地 git clone 后跑一遍 AST 建图,看看它标的架构漂移准不准——尤其适合你想重构又不敢动的祖传项目。
  3. 盯紧 ACP:如果你在做或打算做 multi-agent 系统,别急着自研协作格式。先读一遍 Grok Build 的 ACP 文档,判断它会不会成为下一个 MCP 级别的标准。

优先级排序:Flint(即刻可用、收益最直接)> Onboard-CLI(接手老项目时用)> ACP(架构前瞻,提前卡位)。


参考来源

  1. Microsoft Research — Flint: A visualization language for the AI era(2026-07-08):microsoft.com/en-us/research/blog/flint-a-visualization-language-for-the-ai-era/
  2. Flint 项目站 / 仓库:microsoft.github.io/flint-chart | github.com/microsoft/flint-chart
  3. Onboard-CLI 仓库与 Show HN:github.com/animesh-94/Onboard-CLI | news.ycombinator.com/item?id=48836813
  4. xAI 官方 — Introducing Grok Build:x.ai/news/grok-build-cli
  5. Grok Build 定价 / 架构与 Agent Client Protocol 解读:aitoolsrecap.com/Blog/xai-grok-build-beta-agent-client-protocol-2026 | news.creeta.com/en/grok-build-xai-parallel-agents-benchmarks-2026/

本文由「51学通信」技术团队出品。51学通信由通信行业18年老兵爱卫生(微信ID: gprshome201101)维护。 聚焦5G/6G核心网、3GPP标准、AI工具实战。知识星球「51学通信」提供深度技术答疑和行业洞察。

[!tip] 51学通信知识星球 星主:爱卫生(微信:gprshome201101)——公众号「51学通信」创办者,19 年通信行业运维与讲师经验,著有《GPRS网络信令实例详解》《EPC原理与实践》《5G核心网原理与实践》三本纸质书(各大电商平台有售)。 星球定位:深耕 5G 核心网、IMS、NFV/AI、云原生等 ICT 领域,主打运维岗位与信令分析。 当前规模:5200 篇主题 / 990 个回答,198 元/年。 加入福利:加入星球后请加爱卫生微信,拉您进知识星球年度陪伴与答疑群——不限量回复您的各种问题,另有群内分享。 AI 加持:51学通信知识星球已作为 skill 接入 WorkBuddy,使用 deepseek-4-flash 在海量星球帖子中精准找贴、找视频、找 FAQ 和案例,做总结、找文档和 PPT 等场景全覆盖。

51学通信知识星球海报-扫码加入