上周扫 HN 的 Show HN 榜单（news.ycombinator.com/show），我注意到一个比单个工具更重要的信号：**海外开发者正在把「AI调用工具」这件事从服务端搬进网页里**。今天拆解三个我逐行看过 README 和官网的新货——一个绑定 W3C 新标准的 React 库、一个把 iOS 模拟器塞进 AI 编程会话的 opencode 分叉、一个单二进制替换 GitLab+Jenkins 还自带 42 个 MCP 工具的自托管平台。文末附送两个 GPU 低价渠道的彩蛋。 ## 一、webmcp-react：你的网页，正在变成 AI 的「工具箱」 **链接**：https://github.com/agentcathq/webmcp-react（MIT 开源，免费） 先说背景，这是真正的时间差信息。W3C 的 Web Machine Learning 社区组有一个提案标准叫 **WebMCP**：给浏览器加上 `document.modelContext` API，让**任何网页都能向 AI Agent 暴露带类型、可调用的工具**。Chrome 已经以 Early Preview 形式内置了这个 API（官方博客地址 developer.chrome.com/blog/webmcp-epp）。 webmcp-react 就是这个标准的 React 绑定库，上周刚发布 v1.0.0。用法极简： ```bash npm install webmcp-react zod ``` ```tsx useMcpTool({ name: "search", description: "Search the catalog", input: z.object({ query: z.string() }), handler: async ({ query }) => ({ content: [{ type: "text", text: `Results for: ${query}` }], }), }); ``` 写完这一段，你的网页就多了一个任何 WebMCP 兼容 Agent 都能发现和调用的搜索工具。库本身做得很工程化：Zod 优先（也支持裸 JSON Schema）、SSR 安全（Next.js/Remix 可用）、StrictMode 安全（防重复注册）、没有原生 API 时自动装 polyfill。一个细节值得点赞：**工具随组件挂载/卸载自动注册/注销**，你可以按用户权限动态暴露工具——管理员登录才注册 admin 工具。 接入方式分两路，官方 README 写得很清楚： - **Codex** 已经原生支持 `document.modelContext`，打开页面就能直接发现并调用工具； - **Claude Code、Cursor** 这类 MCP 客户端暂不支持浏览器内部 API，需要装一个 WebMCP Bridge Chrome 扩展做桥接（扩展在 Chrome Web Store 可搜「WebMCP Bridge」）。 还有个前瞻细节：Chrome 153+ 里 Agent 取消调用时会自动触发 AbortSignal，你可以把它直接传给 fetch，做到「Agent 取消 = 请求取消」。作者甚至做了一个可玩的 Wordle 演示页（agentcathq.github.io/webmcp-react/playground），AI 可以通过网页暴露的工具自己玩猜词游戏。 **为什么这是大事**：过去两年国内外的 Agent 生态都在卷「MCP Server」——让 AI 接入你的后端。而 WebMCP 把方向反过来了：**前端主动给 Agent 递工具**。想象你的电商页面直接向 Agent 暴露 search、add_to_cart、checkout 三个工具，用户对着 AI 说「帮我买一台适合跑模型的台式机」，Agent 在页面内完成整个流程。做过 GEO（生成式引擎优化）的人应该明白，这是下一个战场：**以前优化网页给搜索引擎看，以后要给 Agent 提供「可调用接口」**。 **与国内对比**：国内 Agent 生态还在卷各自 App 的接入和 MCP 服务器托管，网页侧标准基本无人跟进。这个库 MIT 免费开源，现在抄进去做 demo，等 Chrome 正式版发布你就是国内第一批有现成案例的人。 **适用人群**：前端工程师、做电商/SaaS 出海的团队、所有押注 Agent 分发渠道的人。 ```mermaid flowchart TB A["你的网页 React 组件"] --> B["useMcpTool 注册工具"] B --> C["document.modelContext"] C --> D{"Agent 如何接入"} D -->|原生支持| E["Codex 直接发现并调用"] D -->|需要桥接| F["WebMCP Bridge 扩展"] F --> G["Claude Code 与 Cursor 等 MCP 客户端"] E --> H["用户确认后执行工具"] G --> H ``` ## 二、MobileCode：AI 写 App，模拟器直接长在会话窗口里 **链接**：https://github.com/hsandhu/mobilecode（MIT 开源，免费） AI 编程工具写 Web 项目已经很顺了，但**移动端一直是断的**：AI 改完 Swift/Kotlin 代码，你还得自己切 Xcode、等构建、开模拟器、把报错复制回对话框。MobileCode 是 opencode 的一个分叉，专门补这个缺口。 核心能力三个： 1. **内嵌设备画面**。检测到 iOS/Android 项目后，它自动起 `serve-sim`/`serve-avd` 服务，把 iOS Simulator 或 Android Emulator 的实时画面流式渲染在会话窗口旁边。Xcode 工程、CocoaPods、Expo、Gradle 项目都能识别（往下探测两层目录）。 2. **一键双端运行**。React Native 项目按一个 Play 键：自动起一个 Metro 服务，`expo prebuild` 生成原生工程、装 Pod、`adb reverse` 打通模拟器，**一个 Metro 同时喂 iOS 和 Android 两端**。iOS 走 `xcodebuild` + `simctl install/launch`，Android 走 `./gradlew assembleDebug` + `adb install -r -g`。 3. **Agent 自主修构建**。这是最值钱的设计：一个叫 `device_run` 的工具让 Agent 自己构建、自己等结果、**自己读构建报错和日志尾部**，然后自己改代码重试——不再需要你当「人肉日志搬运工」。构建失败时第一个编译器/Gradle 错误会直接显示在状态栏。 它完整继承了 opencode 的能力（多模型接入、MCP、插件、skills、Web UI、桌面端），配置文件直接复用 `~/.config/opencode`，所以 opencode 老用户零迁移成本。所有设备操作还暴露了 HTTP API（`POST /api/device-preview/run` 等），可以脚本化批量跑。 **注意门槛**：iOS 功能要求 macOS + Xcode（serve-sim 需要 Node 20+），Android 需要 SDK platform-tools 和至少一个 AVD。Linux/Windows 用户只能玩 Android 半边。 **与国内对比**：国内主流 AI 编程工具还是 IDE 插件形态，聚焦代码补全和对话，没有一个把「构建→安装→启动→看画面→读报错→自修」这个移动端闭环做进产品里的。做 RN/Expo 出海应用的小团队，这个分叉可以立刻上手，模型费照常用自己的 API Key（任意 provider 可选），工具本身零成本。 ```mermaid flowchart LR A["Agent 发起 device_run"] --> B["xcodebuild 或 Gradle 构建"] B --> C["simctl 或 adb 安装并启动"] C --> D["模拟器画面嵌入会话"] D --> E["读取报错与日志尾部"] E --> A ``` ## 三、Kovanex：一个二进制换掉 GitLab+Jenkins+Jira+Vault，还内置 42 个 MCP 工具 **链接**：https://kovanex.dev（Apache 2.0 开源，免费自托管，当前版本 v8.4.0） 上周出现在 Show HN 新帖区（作者 ID naykip，站内名 Kovavue），我顺着摸到官网，信息量比标题大得多。定位一句话：**自托管 DevOps 一体机**——Git 托管、CI/CD、看板、密钥保险库、容器镜像仓库、AI Agent 集成，全部塞进一个二进制，**最低 4GB 内存的 VM 就能跑**，五个分钟 `docker compose up -d` 起服务。 几个差异化设计： - **gRPC 原生，没有 REST API**。CLI、原生桌面端（Go/Gio 写的 25MB 应用，非 Electron）、浏览器全走同一套 gRPC 协议，共 24 个 gRPC 服务，190+ RPC 方法。 - **AI Agent 是一等公民**。PSK 认证、按能力路由任务、Agent 间双向流式消息通道；git push、PR、流水线事件自动广播。 - **MCP Server 内置 42 个工具**，Claude Code、Cursor、Copilot 可以直连操作仓库、任务、流水线、Agent 记忆——相当于你的研发平台天然就是 Agent 的手脚。 - **Locia「引导线」项目管理**：专为「健忘的 AI 执行器」设计的 PM 模式，一个 Star 对应一个 Course 对应一个 Focus，**WIP=1 由服务器端强制执行**，每次会话用 `loci slice` 给 Agent 重新锚定上下文。这个思路对国内正在做 Agent 长任务的人很有参考价值。 - **知识库与语义搜索**：Markdown 知识库带 `[[wikilinks]]`，Obsidian 直接兼容（同一个 vault 两个前端）；向量搜索用嵌入式 HNSW 索引，**embedding 由你的 AI 自己提供，数据不出服务器**。 官网有张「诚实对比表」：AI Agent 一栏，Kovanex 是原生（v5.0 起），GitLab 是付费附加，Gitea 和 Jenkins 是没有。集群方案用 gossip 协议，不依赖 etcd 和分布式数据库。 **适用人群**：合规要求代码不出内网的团队、被 5-10 个 SaaS 订阅账单逼疯的小团队、想给现有自托管研发流程加 Agent 能力的运维。国内用 GitLab CE + Jenkins 自建的老铁，这套可以当架构参考——尤其 gRPC-only 和「平台即 MCP Server」两个设计。 ## 四、彩蛋：不用 LLM 的终端助手，和两个 GPU 地板价 同榜还有个值得玩味的信号：**TERMy**（github.com/gioblu），一个「完全不用 LLM」的快速终端助手，上周拿下 **201 分、45 条评论**，冲进 Show HN 前列。在全民 AI 的 2026 年，「反 AI」工具能拿高分，说明社区开始警惕把所有问题都交给大模型的成本与延迟——零 API 费、毫秒级响应的规则型工具正在回潮。 顺手捡到两个价格差信息（均为作者在 Show HN 页面自述，未经第三方验证）： - **compute.cheap**：H100 租赁 **$2.04/小时**、H200 **$3/小时**（帖子 60 分）； - **tama.computer**：带 GPU 的 Agent 沙盒，**$0.20/小时** 起。 跑批处理、微调实验的可以拿这两家压价当谈判筹码。 ## 信息差总结 | 维度 | 你知道的 | 别人已经在做的 | |------|---------|--------------| | Agent 接入 | 卷 MCP Server 接后端 | W3C WebMCP 提案，网页用 document.modelContext 主动给 Agent 递工具，Chrome 已 Early Preview | | AI 写移动端 | IDE 插件补代码，手动跑模拟器 | MobileCode 里 Agent 自己构建/安装/读报错/自修，模拟器内嵌会话 | | 研发平台 | GitLab+Jenkins 拼装，AI 另买 | Kovanex 单二进制全包，内置 42 个 MCP 工具给 Agent 当手脚 | | AI Agent 长任务 | 靠提示词约束 | Locia 模式：服务器端强制 WIP=1，每次会话重锚上下文 | | 终端效率 | 什么都问 LLM | TERMy 零 LLM 助手上热榜 201 分，规则型工具回潮 | ## 行动指南 1. **今天就做**（10 分钟）：`npm install webmcp-react zod`，给你的产品页面注册一个 search 工具，装 WebMCP Bridge 扩展后在 Claude Code 里跑通一次调用——你会立刻理解「网页即工具」的想象空间。 2. **本周试**：RN/Expo 开发者拉下 MobileCode（`curl -fsSL https://raw.githubusercontent.com/hsandhu/mobilecode/main/install | bash`），让 Agent 自己跑通一次「构建失败→读日志→修复→重跑」闭环。 3. **本月评估**：如果你在维护自建 GitLab，把 Kovanex 的 Locia PM 和 MCP Server 设计抄进内部方案；或者直接在内网测试环境 docker compose 起一套。 4. **长期下注**：把「Agent 可调用性」写进前端需求文档——tool 命名、描述、参数设计，会像当年的 SEO meta 标签一样成为标配岗位技能。 ## 参考来源 1. HN Show 榜单（本文所有工具的一手发现页）：https://news.ycombinator.com/show 2. webmcp-react 官方仓库与 README：https://github.com/agentcathq/webmcp-react 3. WebMCP 标准提案（W3C Web ML 社区组）：https://github.com/webmachinelearning/webmcp 4. MobileCode 仓库：https://github.com/hsandhu/mobilecode 5. Kovanex 官网（含对比表与 Agent 快速上手）：https://kovanex.dev --- > 本文由「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 等场景全覆盖。