AI Agent on 拾光集

一句话克隆网站：AI Agent 像素级复刻工具

Wed, 29 Jul 2026 10:37:00 +0800

想快速复刻一个网站的页面设计，又不想从零手写 React 组件和 CSS？

AI Website Cloner Template 提供了一套基于 AI Agent 的网站逆向工程流程：输入目标网址并运行 /clone-website，AI 会分析页面、提取设计规范、下载素材，并生成结构清晰的 Next.js 项目。

它并不是简单的“截图转 HTML”，而是把网站拆解为可维护的 React 组件、Tailwind CSS 样式、TypeScript 类型和本地素材文件，适合网站迁移、旧站重建、源码找回和前端学习。

这个工具能做什么？

它主要解决的是“从现有网站视觉效果到可编辑前端代码”的问题。

自动截取桌面端和移动端页面
提取颜色、字体、间距、圆角、阴影等设计 Token
分析滚动、悬停、点击、弹窗和轮播等交互
下载图片、视频、字体、SVG 和网站图标
按页面区块生成 React 组件规格
并行生成 Next.js 组件
对比原站与复刻页面，进行视觉 QA
输出可继续修改和部署的前端项目

核心工作流程

1. 页面侦察

AI Agent 通过浏览器自动化工具打开目标网站，滚动并检查完整页面，同时记录桌面端、移动端和不同交互状态。

2. 提取设计规范

工具会读取页面的实际样式，包括：

字体名称、字号和字重
颜色和渐变
内外边距
圆角、边框和阴影
响应式断点
动画时间和缓动方式

这些数据会被整理为 Tailwind CSS 和全局样式中的设计 Token，减少凭感觉猜测样式的问题。

3. 下载真实素材

页面中的图片、视频、字体、SVG、favicon 和 Open Graph 图片会被保存到本地项目中。

这意味着生成结果使用的是目标页面的真实素材，而不是由 AI 临时生成的占位内容。

4. 生成组件规格

AI 会按照导航栏、首屏、功能区、案例区、价格区和页脚等页面区块，生成详细的组件规格文档。

规格中会记录：

组件结构
文本内容
精确样式值
素材路径
交互状态
响应式表现

5. 并行生成代码

不同区块可以交给多个 AI Agent 并行处理，最终合并为完整页面。

生成项目主要使用：

Next.js
React
TypeScript
Tailwind CSS
shadcn/ui

6. 视觉 QA

页面生成后，AI 会再次运行网站并截图，与原页面进行视觉对比，检查布局、字体、颜色、间距和素材是否存在明显偏差。

生成后的项目结构

src/
├─ app/                 # Next.js 路由与页面
├─ components/          # 页面 React 组件
│  ├─ ui/               # shadcn/ui 基础组件
│  └─ icons.tsx         # 提取的 SVG 图标
├─ hooks/               # 自定义 React Hooks
├─ lib/                 # 公共工具
└─ types/               # TypeScript 类型

public/
├─ images/              # 下载的图片
├─ videos/              # 下载的视频
└─ seo/                 # favicon、OG 图片等

docs/
├─ research/            # 页面分析与组件规格
└─ design-references/   # 原网站截图

如何使用？

准备条件

使用前需要准备：

Node.js 24 或更高版本
一个支持该项目的 AI 编程工具
可用的浏览器自动化能力，例如 Chrome MCP、Playwright MCP 或 Puppeteer MCP

项目推荐使用 Claude Code，同时也支持 Codex CLI、Cursor、Gemini CLI、GitHub Copilot、Windsurf、Cline、Roo Code 等工具。

第一步：创建自己的项目

打开 GitHub 项目页面，点击 Use this template，再选择 Create a new repository。

不要直接把官方模板仓库当成自己的网站项目提交修改。

第二步：克隆自己的仓库

1
2
3

git clone https://github.com/你的用户名/你的仓库名.git
cd 你的仓库名
npm install

第三步：启动 AI Agent

以 Claude Code 为例：

`1`	`claude --chrome`

第四步：运行网站克隆命令

`1`	`/clone-website https://example.com`

也可以一次提供多个网址：

`1`	`/clone-website https://example.com https://example.com/pricing`

第五步：运行项目

`1`	`npm run dev`

完成后访问本地开发地址，检查页面并继续修改内容、品牌信息和业务逻辑。

它适合哪些场景？

适合

将自己的网站迁移到 Next.js
旧网站只有线上页面，但源码已经丢失
将 WordPress、Webflow 或 Squarespace 页面重建为现代前端项目
学习优秀网站的布局、动效和响应式设计
快速搭建内部原型或页面改版基础
在获得授权后重建客户网站

不适合

自动还原原网站的后端数据库
复制登录、支付、会员和实时业务系统
自动修复原网站不合理的业务逻辑
把别人的品牌、文案和设计冒充为自己的作品
制作钓鱼网站或仿冒登录页面
绕过目标网站的服务条款、版权或访问限制

使用前必须知道的限制

“像素级复刻”是一项目标，而不是任何网站都能百分之百实现的保证。

以下内容通常仍需要人工调整：

复杂的 WebGL、Canvas 或 3D 动画
登录后才能访问的页面
依赖后端接口的动态数据
个性化推荐和实时内容
支付、账号、权限和数据库逻辑
受跨域、反爬虫或访问权限保护的素材
原网站未公开的源代码与内部实现

生成完成后，开发者仍然需要进行代码 Review、性能优化、无障碍检查、SEO 配置和业务改造。

一句话总结

AI Website Cloner Template 更像一个“网站视觉逆向工程助手”，而不是自动重构完整业务系统的万能工具。

它可以显著缩短页面搭建时间，并把目标网站的视觉结构转换为可继续开发的 Next.js 代码；但后端功能、版权合规、性能优化和真实业务逻辑，仍然需要开发者自己完成。

GitHub 项目

项目名称：AI Website Cloner Template
GitHub：JCodesMore/ai-website-cloner-template
开源协议：MIT

请只复刻自己拥有、已经获得授权，或明确允许研究和重建的网站。不要将该工具用于仿冒、钓鱼、侵权或其他违法用途。

Codex + Obsidian 长期记忆配置：让 AI 跨项目记住工作进度和关键决策

Tue, 28 Jul 2026 19:42:00 +0800

Codex 每次开始新任务时，最麻烦的问题之一，就是需要重新解释项目背景、工作习惯和之前做过的决定。

解决这个问题的一种方法，是把 Obsidian 作为 Codex 的外部长期记忆库，将项目规划、关键决策、工作流程和每日复盘记录保存在本地 Markdown 文件中。

需要说明的是，这种方案并不是给 Codex 增加真正意义上的“永久大脑”，而是建立一套：

任务前读取历史信息，任务后更新工作记录的本地记忆工作流。

目前 Codex 已经提供本地 Memories 功能，相关文件默认保存在 ~/.codex/memories/，并可通过 /memories 控制当前对话是否读取或生成记忆。Obsidian 方案的价值，则在于记忆内容更加透明、可编辑、可分类，也更方便跨项目和跨工具使用。

一、Codex + Obsidian 的工作原理

整个流程可以分为四步：

在 Obsidian 中建立固定的记忆库目录。
使用 AGENTS.md 告诉 Codex 应该读取哪些笔记。
每次任务开始前，读取相关项目状态和历史决策。
任务完成后，将结果、问题和下一步计划写回 Obsidian。

Codex 会在执行任务前读取 AGENTS.md。你既可以在 ~/.codex/AGENTS.md 中设置全局规则，也可以在具体项目目录中添加项目级规则。

二、推荐的 Obsidian 记忆库结构

可以在 Obsidian Vault 中建立下面的目录：

Codex-Memory/
├── 00_INDEX.md
├── 01_GOALS/
│   └── long-term-goals.md
├── 02_PROJECTS/
│   ├── website.md
│   └── automation.md
├── 03_DECISIONS/
│   └── decision-log.md
├── 04_WORKFLOWS/
│   └── working-rules.md
├── 05_PREFERENCES/
│   └── user-preferences.md
└── 06_DAILY/
    └── 2026-07-28.md

各目录可以分别保存：

00_INDEX.md：记忆库入口和目录说明。
01_GOALS：长期目标和当前重点。
02_PROJECTS：不同项目的背景、进度和待办事项。
03_DECISIONS：重要选择、原因和最终结论。
04_WORKFLOWS：代码规范、发布流程和操作步骤。
05_PREFERENCES：常用格式、表达习惯和工具偏好。
06_DAILY：每日任务总结和复盘记录。

不要让 Codex 每次读取整个 Obsidian 仓库。更合理的方式是先读取索引，再根据当前任务加载相关笔记，这样可以减少无关上下文和 Token 消耗。

三、配置 Codex 的 AGENTS.md

在全局 Codex 目录或项目根目录中创建：

`1`	`AGENTS.md`

Windows 用户通常可以放在：

`1`	`C:\Users\你的用户名\.codex\AGENTS.md`

示例内容：

# Codex 长期记忆规则

## Obsidian 记忆库

记忆库路径：

D:\Obsidian\Codex-Memory

## 开始任务前

1. 首先读取 `00_INDEX.md`。
2. 根据当前任务判断所属项目。
3. 读取对应的 `02_PROJECTS` 项目文件。
4. 检查 `03_DECISIONS` 中是否存在相关历史决策。
5. 只读取与当前任务直接相关的笔记，不要扫描整个仓库。

## 完成任务后

1. 更新对应的项目状态。
2. 将重要决策写入 `03_DECISIONS/decision-log.md`。
3. 将当天完成内容写入 `06_DAILY/YYYY-MM-DD.md`。
4. 记录遇到的问题、解决方案和下一步计划。
5. 不要保存密码、API Key、Cookie 或其他敏感信息。

## 记忆写入原则

只保存未来仍然有价值的信息，包括：

- 长期目标
- 项目背景
- 技术选择
- 关键决策及原因
- 可复用工作流程
- 用户明确表达的长期偏好

不要保存临时聊天、重复内容和一次性任务信息。

四、设置每日复盘

仅在 AGENTS.md 中写入“每天凌晨复盘”，并不会让 Codex自动执行。

要实现定时复盘，还需要使用：

Windows 任务计划程序
Linux 或 macOS 的 Cron
支持定时任务的 AI Agent
已经包含夜间整理功能的 Obsidian AI 项目

每天执行的复盘任务可以使用下面的提示词：

读取今天的项目记录和每日笔记。

请完成以下工作：

1. 总结今天完成的主要任务。
2. 提取值得长期保存的关键决策。
3. 更新对应项目的当前状态。
4. 合并重复或已经失效的信息。
5. 将复盘结果写入今天的每日笔记。
6. 不要写入密码、Token、Cookie 或其他敏感数据。

部分开源项目已经实现了夜间整理、索引更新和跨项目记忆功能，但不同项目的自动化程度并不相同。例如，codex-obsidian-memory-loop 明确定位为手动复盘工作流，而不是后台自动监控系统。

五、原生 Codex Memory 与 Obsidian 的区别

方案	主要特点	适合场景
Codex 原生 Memories	自动从历史对话生成本地记忆	希望简单开启、减少手动维护
Obsidian 记忆库	内容透明、可编辑、可分类	项目管理、知识沉淀、跨工具复用
AGENTS.md	固定 Codex 的读取和执行规则	编码规范、项目流程、记忆读取入口
定时复盘脚本	自动整理每日记录	长期项目和持续知识维护

更实用的方式不是二选一，而是组合使用：

使用 Codex Memories 保存自动生成的上下文。
使用 Obsidian 保存经过确认的重要知识。
使用 AGENTS.md 定义读取和写回规则。
使用定时任务完成每日整理。

六、使用时需要注意的问题

不要保存敏感信息

不要把下面的信息写入记忆库：

API Key
登录密码
Cookie
私钥
客户隐私资料
未脱敏的内部数据

Codex 官方也建议在共享 Codex 目录或记忆文件前检查其中是否包含敏感内容。

不要无限追加笔记

记忆库并不是越大越好。

如果所有对话和日志都永久保存，Codex 检索时反而更容易读到过期信息。建议定期执行：

删除重复记录
标记失效决策
合并相似笔记
更新项目当前状态
保留决策发生的时间和原因

重要操作仍需人工确认

Codex 可以参考历史记录，但涉及删除文件、修改生产环境、付款、发布和权限调整时，仍然应该由用户最终确认。

七、适合使用这套方案的人

这套 Codex + Obsidian 长期记忆工作流，比较适合：

同时维护多个代码项目的开发者
经常使用 Codex 处理重复任务的人
希望沉淀项目决策和踩坑记录的个人用户
使用多个 AI 编程工具的团队
希望将 Obsidian 打造成 AI 第二大脑的人

它真正解决的问题，不是让 Codex 永远记住所有聊天，而是让重要信息以本地文件的形式保存下来，并在需要时被准确读取。

WorkBuddy + HyperFrames 安装教程：接入本地 Qwen3-TTS，实现自己的声音自动配音

Tue, 28 Jul 2026 11:55:00 +0800

想用 AI 自动生成动画视频，但不熟悉 Node.js、FFmpeg、命令行和环境配置？

一种更省事的方案是：使用 WorkBuddy 协助安装和排查问题，用 HyperFrames 把 HTML 动画渲染成 MP4，再通过桥接脚本接入本地 Qwen3-TTS，实现字幕、画面和个人声音配音的一体化制作。

一、三个工具分别做什么？

WorkBuddy

WorkBuddy 是腾讯推出的桌面 AI Agent。它不仅能回答问题，还可以协助执行命令、安装依赖、修改文件和分析报错。

在这套流程中，它主要负责：

检查电脑环境
安装 HyperFrames
执行终端命令
分析安装报错
编写 Qwen3-TTS 桥接脚本
调整视频项目文件

需要注意的是，WorkBuddy 本身不是 HyperFrames 的必要依赖。熟悉命令行的用户，也可以手动完成全部操作。

HyperFrames

HyperFrames 是 HeyGen 开源的 HTML 转视频框架。

它允许开发者使用 HTML、CSS、JavaScript 和动画时间轴制作画面，再按照固定帧逐帧渲染为 MP4 视频。

适合制作：

产品介绍动画
数据可视化视频
知识讲解视频
字幕配音视频
网页演示视频
社交媒体短视频

与传统录屏不同，HyperFrames 使用确定性的逐帧渲染方式。同一个项目重复渲染时，画面和动画时间通常能够保持一致。

Qwen3-TTS

Qwen3-TTS 是通义千问团队开源的语音生成模型，支持文本转语音、音色设计和声音克隆。

将它部署在本地后，可以用参考音频生成接近目标音色的配音，不必每次调用第三方在线语音接口。

请只克隆自己拥有授权的声音，不要冒用他人身份或未经允许复制他人音色。

二、安装前需要准备什么？

本文以 Windows 环境为例。

建议提前准备：

Node.js
FFmpeg
WorkBuddy
已部署的 Qwen3-TTS，可选
足够的磁盘空间

如果暂时没有 Qwen3-TTS，也可以先完成 HyperFrames 的安装和视频渲染，后续再接入本地配音。

三、安装 Node.js

前往 Node.js 官网下载长期支持版，也就是 LTS 版本。

安装完成后，打开 PowerShell 或 Windows Terminal，执行：

1
2

node -v
npm -v

如果能够正常显示版本号，说明 Node.js 和 npm 已安装成功。

例如：

1
2

v22.x.x
10.x.x

如果系统提示找不到 node 命令，可以尝试：

关闭并重新打开终端。
重启电脑。
检查 Node.js 是否已加入系统环境变量。

四、安装 FFmpeg

以管理员身份打开 PowerShell，然后执行：

`1`	`winget install --id Gyan.FFmpeg`

安装完成后，重新打开终端并检查：

`1`	`ffmpeg -version`

能够看到 FFmpeg 的版本和编译信息，即表示安装成功。

如果 winget 无法使用，也可以从 FFmpeg 官方网站下载 Windows 构建版本，再手动配置环境变量。

五、安装 WorkBuddy

前往 WorkBuddy 官方网站，下载适合 Windows 或 macOS 的客户端。

安装并登录后，可以先让 WorkBuddy检查当前环境：

`1`	`请检查这台电脑是否已经安装 Node.js、npm 和 FFmpeg，并分别输出版本号。缺少的依赖请告诉我具体安装方法。`

这样做的好处是，可以先发现环境问题，再开始安装 HyperFrames，避免安装到一半才发现依赖缺失。

六、使用 WorkBuddy 安装 HyperFrames

打开 WorkBuddy，新建一个空文件夹作为视频项目目录，然后输入：

`1`	`请在当前目录安装 HyperFrames，并创建一个可以预览和渲染的最小示例项目。完成后检查 Node.js、FFmpeg 和浏览器渲染依赖是否正常。`

也可以手动安装 HyperFrames Skill：

`1`	`npx skills add heygen-com/hyperframes --yes`

安装完成后，可以让 WorkBuddy 创建一个简单测试视频：

请使用 HyperFrames 创建一个 8 秒的 16:9 测试视频。

要求：
1. 深色背景。
2. 中间显示“Hello HyperFrames”。
3. 文字淡入并轻微向上移动。
4. 最后导出为 MP4。

七、运行环境体检

在项目目录中执行：

`1`	`npx hyperframes doctor`

部分安装方式可能也支持：

`1`	`hyperframes doctor`

建议优先使用 npx hyperframes，因为它会调用当前项目使用的版本，能够减少全局版本和项目版本不一致的问题。

环境体检通常会检查：

Node.js
FFmpeg
浏览器或 Chromium
HyperFrames 项目配置
视频渲染相关依赖

如果出现报错，不要只发送最后一行错误。建议把完整终端输出复制给 WorkBuddy：

1
2
3

下面是执行 npx hyperframes doctor 后的完整报错。

请先判断是哪项依赖失败，再给出修复步骤。不要删除现有项目文件，也不要升级无关依赖。

八、预览和渲染视频

创建好 HTML 动画项目后，可以先预览：

`1`	`npx hyperframes preview`

确认画面、动画和字幕没有问题后，再执行渲染：

`1`	`npx hyperframes render index.html`

也可以指定输出文件：

`1`	`npx hyperframes render index.html --output output.mp4`

不同版本的命令参数可能有所变化。如果命令报错，应先运行：

`1`	`npx hyperframes --help`

以当前安装版本显示的命令为准。

九、接入本地 Qwen3-TTS

HyperFrames 负责画面渲染，Qwen3-TTS 负责生成配音。两者之间通常需要增加一个桥接层。

整体流程如下：

视频文案
   ↓
桥接脚本
   ↓
本地 Qwen3-TTS 接口
   ↓
生成 WAV 或 MP3
   ↓
HyperFrames 读取音频
   ↓
根据音频时长生成字幕和动画
   ↓
导出 MP4

桥接脚本主要负责：

接收需要配音的文字。
调用本地 Qwen3-TTS。
指定参考音频和参考文本。
保存生成的音频。
把音频文件路径返回给 HyperFrames。

十、让 WorkBuddy 编写桥接脚本

假设本地 Qwen3-TTS 已经提供 HTTP API，可以向 WorkBuddy 输入：

我的本地 Qwen3-TTS 服务已经启动，请为当前 HyperFrames 项目编写一个 TTS 桥接脚本。

要求：
1. 接收中文文本。
2. 调用本地 Qwen3-TTS HTTP API。
3. 支持配置 API 地址、参考音频和参考文本。
4. 将生成结果保存到 public/audio 目录。
5. 返回音频文件路径和音频时长。
6. 请求失败时输出明确的错误信息。
7. 不要把本地路径和接口地址写死，统一放到 .env 文件中。
8. 同时生成 .env.example 和使用说明。

建议在 .env 中保存类似配置：

1
2
3

QWEN_TTS_API_URL=http://127.0.0.1:8000
QWEN_TTS_REF_AUDIO=D:/voice/reference.wav
QWEN_TTS_REF_TEXT=这里填写参考音频对应的准确文字

不要把真实的本地路径、密钥或个人声音样本提交到公开 GitHub 仓库。

可以在 .gitignore 中加入：

.env
public/audio/
private/
*.wav

十一、一个容易忽略的问题：接口格式不一定相同

“已经部署 Qwen3-TTS”并不代表所有项目都使用相同接口。

不同的本地部署项目可能使用：

Python 函数调用
FastAPI 接口
Gradio 接口
OpenAI 兼容接口
自定义 WebSocket 接口

因此，桥接脚本不能直接照搬。至少要先确认：

接口地址：
请求方法：
请求参数：
返回格式：
音频格式：
是否需要参考音频：
是否需要参考文本：

可以让 WorkBuddy读取本地 Qwen3-TTS 项目的 README 或接口代码，然后根据真实接口编写适配脚本。

推荐提示词：

`1`	`请读取这个 Qwen3-TTS 项目的 README 和服务端接口代码，确认真实的请求地址、参数和返回格式，再修改 HyperFrames 桥接脚本。不要猜测接口字段。`

十二、生成自己的声音配音

Qwen3-TTS 的声音克隆通常需要准备：

一段清晰的参考音频
参考音频对应的准确文字
需要生成的新文案

参考音频建议：

环境安静
没有背景音乐
没有明显混响
只有一个人说话
发音清楚
参考文本与录音内容一致

完成配置后，可以让 WorkBuddy执行测试：

请使用本地 Qwen3-TTS 生成一段中文测试配音，文案为：

“这是通过 HyperFrames 和本地语音模型生成的一段测试视频。”

生成后检查音频是否可以正常播放，再把它加入 HyperFrames 时间轴，并生成同步字幕。

确认试听结果正常后，再开始生成正式视频。

十三、常见问题

1. 找不到 `hyperframes` 命令

优先尝试：

`1`	`npx hyperframes --help`

如果可以运行，说明 HyperFrames 安装在当前项目，而不是全局环境。

2. FFmpeg 已安装，但终端仍然找不到

关闭所有终端窗口后重新打开。

仍然无效时，检查 FFmpeg 的 bin 目录是否已经加入系统 Path。

3. 浏览器下载失败

可能与网络、代理、防火墙或缓存有关。

可以把完整错误日志交给 WorkBuddy，重点检查：

下载地址是否可以访问
系统代理是否生效
防火墙是否拦截
磁盘空间是否充足
浏览器缓存目录是否损坏

4. 视频有画面但没有声音

检查：

音频文件是否真实存在
HTML 中的文件路径是否正确
音频格式是否受支持
音频是否加入时间轴
渲染时 FFmpeg 是否检测到音轨

5. 字幕和配音不同步

不要只按照文字长度估算时间。

更可靠的方式是先生成音频，再读取真实音频时长，根据句子或时间戳安排字幕和动画。

6. 自己的声音不像

重点检查：

参考音频是否清晰
参考文本是否准确
是否选择了支持声音克隆的 Base 模型
音频中是否包含噪声、音乐或多人说话
桥接脚本是否正确传递参考音频

十四、这套方案适合谁？

这套工作流适合：

不熟悉命令行的内容创作者
想批量制作知识类视频的人
需要自动生成字幕和配音的人
希望减少在线视频工具费用的人
已经部署本地语音模型的用户
想用 HTML、CSS 和 JavaScript 制作动画的人

它的核心价值不是“完全不用配置”，而是让 AI Agent 帮助完成重复安装、脚本适配和错误排查，把视频生产流程从多个工具之间的手动切换，变成相对统一的自动化工作流。

总结

WorkBuddy、HyperFrames 和 Qwen3-TTS 分别解决了三个问题：

WorkBuddy：负责安装、执行和排错。
HyperFrames：负责把 HTML 动画渲染成 MP4。
Qwen3-TTS：负责本地语音生成和个人音色配音。

真正关键的环节，是根据本地 Qwen3-TTS 的真实接口编写桥接脚本，而不是简单复制一段固定代码。

完成桥接后，就可以形成一条相对完整的自动化流程：

输入视频主题
→ AI 生成脚本和 HTML 动画
→ Qwen3-TTS 生成配音
→ 自动生成字幕
→ HyperFrames 渲染 MP4

项目与官方地址

WorkBuddy 官方介绍：https://docs.cloudbase.net/ai/ai-tools/workbuddy
HyperFrames GitHub：https://github.com/heygen-com/hyperframes
HyperFrames 文档：https://hyperframes.heygen.com/
Qwen3-TTS GitHub：https://github.com/QwenLM/Qwen3-TTS

Headroom：最高减少 92% Token，用 AI 编程时别再把钱浪费在无效上下文上

Mon, 27 Jul 2026 20:09:00 +0800

使用 Claude Code、Codex、Cursor 等 AI 编程工具时，真正消耗 Token 的往往不只是你输入的提示词。

代码搜索结果、终端日志、报错堆栈、GitHub Issue、历史对话和 RAG 检索内容，都会被不断塞进上下文。随着任务持续进行，上下文越来越长，每次请求的成本和等待时间也会随之增加。

最近发现的开源项目 Headroom，就是专门解决这个问题的。

它会在日志、代码、文件和工具输出发送给大模型之前，先识别内容类型并压缩其中的重复信息和低价值内容，让模型尽量只接收真正需要的信息。

根据项目公开测试，部分场景可以减少约 47%—92% 的输入 Token。

Headroom 是什么？

Headroom 是一个面向 AI Agent 和 AI 编程工具的上下文压缩层。

简单理解，它位于 AI 工具与大模型 API 之间：

Claude Code / Codex / Cursor
            ↓
         Headroom
     压缩日志、代码和历史上下文
            ↓
   OpenAI / Anthropic 等模型

它并不是简单粗暴地删除历史消息，而是根据内容类型选择不同的压缩方式。

例如：

JSON 数据使用结构化压缩
源代码按照 AST 语法结构处理
普通文本使用专门的压缩模型
重复日志、无关字段和冗余搜索结果会被优先精简
原始内容可保存在本地，需要时仍可重新获取

Headroom 默认在本地运行，项目说明中表示，处理的数据可以保留在本机，而不需要额外上传到第三方压缩服务。

实际能节省多少 Token？

Headroom 项目给出了几组真实 Agent 工作负载测试数据：

使用场景	压缩前	压缩后	Token 减少
代码搜索，返回 100 条结果	17,765	1,408	92%
SRE 事故日志排查	65,694	5,118	92%
GitHub Issue 分类	54,174	14,761	73%
大型代码库探索	78,502	41,254	47%

这组数据说明，Headroom 最适合处理大量结构化数据、搜索结果和重复日志。

如果只是几句话的简单问答，压缩空间通常不会特别明显；但在大型代码仓库、持续调试或多 Agent 工作流中，每次节省的 Token 会不断累积。

压缩后会不会影响回答质量？

这是使用上下文压缩工具时最需要关注的问题。

Headroom 项目公开了 GSM8K、TruthfulQA、SQuAD v2 和 BFCL 等测试结果：

测试项目	原始结果	使用 Headroom	变化
GSM8K 数学推理	0.870	0.870	无变化
TruthfulQA 事实问答	0.530	0.560	小幅提升
SQuAD v2 问答	—	97%	19% 压缩率
BFCL 工具调用	—	97%	32% 压缩率

从项目公布的数据看，压缩后没有出现明显的准确率下降，部分测试结果甚至略有提高。

不过需要注意，这些结果主要来自项目方自己的测试环境，并不能代表所有代码库和业务场景。更稳妥的做法，是先在自己的项目中运行一段时间，对比压缩前后的回答质量和 Token 消耗，再决定是否长期启用。

Headroom 支持哪些 AI 编程工具？

Headroom 已经适配多种常见 AI 编程工具，包括：

Claude Code
OpenAI Codex
Cursor
Aider
GitHub Copilot CLI
OpenCode
Cline
Continue
Goose
OpenHands
Grok CLI
Kimi CLI

对于 Claude Code、Codex 和 Aider 等工具，可以直接通过 headroom wrap 启动。

Cursor 目前主要采用手动配置代理地址的方式接入。

此外，Headroom 也支持 Python、TypeScript、LangChain、Agno、LiteLLM、Vercel AI SDK 和 MCP 客户端，适合接入已有的 AI 应用或 Agent 系统。

最简单的安装方法

Headroom 要求 Python 3.10 或以上版本。

推荐使用 uv 进行隔离安装：

`1`	`uv tool install --python 3.13 "headroom-ai[all]"`

也可以直接使用 pip：

`1`	`pip install "headroom-ai[all]"`

安装完成后检查版本：

`1`	`headroom --version`

需要注意，npm 版本只是 TypeScript SDK，并不包含 headroom 命令行工具：

`1`	`npm install headroom-ai`

因此，想直接使用 headroom wrap、代理服务或 MCP 功能，应该优先安装 Python 版本。

在 Claude Code 中使用

安装完成后执行：

`1`	`headroom wrap claude`

Headroom 会启动本地代理，并通过代理启动 Claude Code。

之后，Claude Code 读取代码、运行命令或分析日志时，相关上下文会先经过 Headroom 处理，再发送给模型。

可以使用以下命令检查运行状态：

`1`	`headroom doctor`

查看压缩性能：

`1`	`headroom perf`

打开节省统计面板：

`1`	`headroom dashboard`

在 Codex 中使用

Codex 可以通过下面的命令启动：

`1`	`headroom wrap codex`

如果 Codex 无法识别终端里的 headroom 命令，可以先查询完整路径：

`1`	`command -v headroom`

然后把返回的绝对路径写入 Codex 的 MCP 配置：

1
2
3

[mcp_servers.headroom]
command = "/你的绝对路径/headroom"
args = ["mcp", "serve"]

这种情况通常不是 Headroom 安装失败，而是 Codex 启动时没有继承当前终端的 PATH 环境变量。

跨 Agent 共享记忆

Headroom 不只是压缩工具，还提供跨 Agent 共享上下文的能力。

例如，你可以让 Claude Code 和 Codex 使用同一个本地记忆存储：

1
2

headroom wrap claude --memory
headroom wrap codex --memory

这样，在 Claude Code 中已经分析过的项目内容，可以被压缩、去重后继续提供给 Codex 使用，减少不同 AI 工具重复读取同一批文件。

Headroom 还提供 headroom learn 功能，可以分析失败的历史会话，并把修正经验写入：

CLAUDE.local.md
CLAUDE.md
AGENTS.md
GEMINI.md
GROK.md

这类功能适合长期维护同一个代码库，但自动生成的规则仍然需要人工检查，避免错误经验被持续复用。

Headroom 适合哪些人？

Headroom 更适合以下场景：

经常使用 Claude Code、Codex 或 Cursor
需要分析大量终端日志和报错信息
经常进行大型代码库搜索
使用 API 按 Token 付费
同时使用多个 AI Agent
RAG 检索结果较长且重复内容较多
希望降低上下文成本和请求延迟

下面这些情况则不一定需要安装：

只是偶尔使用网页版 AI 聊天
每次任务都很短，上下文内容很少
使用的环境不允许启动本地代理
已经完全依赖模型厂商自带的上下文压缩
项目涉及敏感业务，但尚未完成安全审查

使用前需要注意什么？

1. 最高 92% 不代表每次都能省 92%

92% 是代码搜索和事故排查等特定测试场景的数据。

根据任务类型不同，实际压缩效果可能只有 20%、40%，也可能在结构化日志中达到更高比例。

2. 先在测试项目中验证

代码上下文可能包含函数签名、错误细节、配置字段和依赖版本。

即使 Headroom 支持可逆压缩，也建议先在非关键项目中测试，确认不会遗漏影响判断的重要信息。

3. 本地运行不等于没有安全风险

Headroom 会位于 AI 工具与模型服务之间，能够接触请求内容。

在公司项目或敏感代码环境中使用前，应检查项目源码、依赖、日志保存方式和代理配置。

4. 定期查看节省数据

可以通过以下命令检查实际收益：

1
2

headroom perf
headroom dashboard

不要只因为项目宣传中的最高数字就长期启用。真正有价值的是，它在你的工作流中能否稳定降低 Token，同时保持结果可靠。

总结

Headroom 解决的不是“提示词写得不够好”，而是 AI Agent 工作过程中产生了太多无效上下文。

代码搜索结果、构建日志、历史对话、RAG 数据和工具返回内容，会不断占用上下文窗口，也会增加 API 成本。

Headroom 在这些内容进入模型前进行结构化压缩，并提供可逆内容检索、跨 Agent 记忆和失败经验学习等功能。对于频繁使用 Claude Code、Codex、Cursor 或其他 AI 编程工具的人，它确实值得测试。

但更准确的说法不是“安装后一定节省 92%”，而是：

在日志、搜索结果和大型代码库等高冗余场景中，Headroom 有机会显著减少 Token；最终效果应以自己的项目测试结果为准。

项目地址

GitHub：https://github.com/headroomlabs-ai/headroom
开源协议：Apache License 2.0
当前 GitHub Stars：约 62.7K，数据会持续变化

Book to Skill：把一本书变成 AI 可以反复调用的知识工具

Mon, 27 Jul 2026 19:55:00 +0800

很多人用 AI 阅读一本书时，通常只会做两件事：

总结全书内容
提炼重点和金句

这种方式可以帮助我们快速了解一本书，却很难真正把书里的方法应用到工作中。

Book to Skill 提供了另一种思路：把 PDF、EPUB、DOCX、Markdown 等文档转换成结构化的 Agent Skill，让 AI 不只是“读过这本书”，而是能够在后续任务中调用书里的框架、原则和方法，帮助你分析问题、检查方案或生成内容。

简单来说，它不是把一本书压缩成一篇摘要，而是把一本书整理成一套可以反复使用的 AI 知识工具。

Book to Skill 是什么？

Book to Skill 是一个开源 Agent Skill，主要用于把书籍、技术文档或一组资料转换成结构化 Skill。

它会从原始文档中提取：

核心框架和思维模型
可以直接执行的方法
决策规则
常见错误和反模式
重要概念与术语
各章节的关键知识
快速查询用的速查表

生成完成后，AI 可以根据当前任务按需读取对应章节，而不是每次都把整本书重新放进上下文。

这意味着，你以后不必反复翻阅几十页甚至几百页的 PDF，也不需要每次重新向 AI 解释这本书讲了什么。

它和普通的 AI 读书总结有什么区别？

普通的 AI 总结通常只能回答：

这本书主要讲了什么？

Book to Skill 更关注的是：

这本书里的方法，应该在什么情况下使用？

例如，一本内容创作类书籍被转换成 Skill 后，你可以让 AI：

根据书中的方法策划短视频选题
设计视频标题和封面文案
检查口播脚本的开头是否足够吸引人
分析内容节奏和信息密度
判断脚本是否存在留存问题
按照书中的标准重写脚本
查询某个概念出自哪个章节

它输出的不是一份看完就放在一边的读书笔记，而是一套能够参与实际工作的知识系统。

Book to Skill 会生成哪些文件？

将一本书转换完成后，通常会得到类似下面的文件结构：

your-book-skill/
├── SKILL.md
├── glossary.md
├── patterns.md
├── cheatsheet.md
└── chapters/
    ├── ch01-introduction.md
    ├── ch02-framework.md
    ├── ch03-methods.md
    └── ...

这些文件分别承担不同作用：

文件	主要用途
`SKILL.md`	保存核心思维模型、使用说明和章节索引
`chapters/`	按章节保存详细知识，需要时再读取
`glossary.md`	整理书中的重要术语和定义
`patterns.md`	汇总技巧、方法、流程和常见模式
`cheatsheet.md`	保存决策规则和快速参考信息

这种结构比单独生成一篇长摘要更实用。

AI 在处理具体问题时，只需要加载相关章节，不必一次把整本书全部塞进上下文，也能减少无关内容对回答的干扰。

支持哪些文档格式？

Book to Skill 当前支持多种常见文档格式，包括：

PDF
EPUB
DOCX
TXT
Markdown
HTML
RTF
reStructuredText
AsciiDoc
MOBI
AZW / AZW3

除了单本书，它还可以处理整个文件夹、多个文档或符合特定规则的一组文件。

因此，它不仅适合处理电子书，也可以用来整理：

企业内部操作手册
品牌规范
产品文档
技术资料
API 说明
行业研究报告
论文与个人笔记
培训教材
项目知识库

只要这些资料是你经常需要查询和使用的，就可以考虑将它们整理成 Skill。

如何安装 Book to Skill？

安装到 Claude Code

在终端中执行：

`1`	`git clone https://github.com/virgiliojr94/book-to-skill.git ~/.claude/skills/book-to-skill`

安装完成后，重新启动 Claude Code，或让它重新加载 Skills。

安装到 GitHub Copilot CLI

`1`	`git clone https://github.com/virgiliojr94/book-to-skill.git ~/.copilot/skills/book-to-skill`

然后在 Copilot CLI 会话中执行：

1
2

/skills reload
/skills info book-to-skill

安装到通用 Agent Skills 目录

`1`	`git clone https://github.com/virgiliojr94/book-to-skill.git ~/.agents/skills/book-to-skill`

这个目录可用于部分兼容开放 Agent Skills 规范的工具。

需要注意的是，不同 AI 编程工具对 Skills 的目录、调用命令和兼容程度可能不同。官方仓库当前明确说明支持 Claude Code、GitHub Copilot CLI 和 Amp。其他工具能否直接使用，应以对应工具的 Skills 文档为准。

如何把一本书转换成 Skill？

假设电脑中有一本书：

`1`	`~/books/content-guide.pdf`

可以执行：

`1`	`/book-to-skill ~/books/content-guide.pdf`

也可以在命令后指定生成的 Skill 名称：

`1`	`/book-to-skill ~/books/content-guide.pdf content-creator-guide`

如果需要把多份资料合并成一个 Skill，可以执行：

`1`	`/book-to-skill ~/books/book.pdf ~/notes/my-notes.md content-knowledge`

处理整个文件夹：

`1`	`/book-to-skill ~/documents/project-docs/ project-knowledge`

处理某个目录中的全部 EPUB 文件：

`1`	`/book-to-skill "~/books/*.epub" my-book-library`

Book to Skill 在正式生成前，还可以先分析文档结构、估算 Token 消耗，并展示预计生成的文件。

对于篇幅较长的书，建议先选择分析模式，确认提取出来的框架和章节是否准确，再继续生成完整 Skill。

一个实际应用案例

假设你有一本关于短视频内容创作的电子书。

转换成 Skill 后，可以让 AI 完成以下任务。

1. 快速了解全书

`1`	`请基于这个 Skill，整理全书的核心框架、关键原则和主要方法。`

2. 生成短视频方案

1
2

请使用书中的内容创作框架，策划一条介绍 Book to Skill 的 60 秒短视频。
需要包含标题、开头钩子、脚本结构、核心画面和结尾行动指令。

3. 检查现有脚本

请按照书中的评估标准，检查这份短视频脚本。

重点分析：
1. 标题点击潜力
2. 前 3 秒吸引力
3. 内容节奏
4. 信息密度
5. 留存风险
6. 惊喜点
7. 可以删除的内容
8. 具体修改方案

4. 查询书中概念

`1`	`请解释书中关于内容留存的核心方法，并说明它适合在哪些场景使用。`

5. 重写脚本

1
2
3

请根据书中的原则重写这份脚本。

保留原来的主题，但增强开头吸引力、内容节奏和结尾转化。

这时，AI 的判断依据不再只是通用知识，而是你提供的那本书中提取出来的框架。

Book to Skill 真正适合哪些人？

这个工具比较适合以下用户：

经常阅读技术书或商业书的人
想把读书笔记真正用于工作的人
内容创作者和短视频运营人员
产品经理与项目负责人
开发者和技术团队
需要频繁查询公司内部文档的团队
想建立个人 AI 知识库的人

如果你只是想快速知道一本书讲了什么，普通的 AI 总结已经足够。

如果你希望 AI 在未来的任务中持续使用书里的方法，Book to Skill 会更有价值。

使用时需要注意什么？

1. 不要把它当成万能知识转换器

生成效果取决于原始文档质量。

扫描模糊、排版混乱、缺少文字层或章节结构不清晰的 PDF，可能会影响内容提取结果。

2. 重要结论仍需回到原文核对

Skill 可以帮助查找、整理和应用知识，但不代表生成结果一定完全准确。

涉及专业决策、法律、医疗、财务或重要商业问题时，应重新核对原始章节。

3. 注意版权与使用权限

建议只处理以下资料：

自己购买并合法取得的电子书
自己创作的内容
公司授权使用的内部文档
开放许可资料
已进入公共领域的作品

不要随意转换、传播或公开分享无权处理的受版权保护内容。

4. 敏感文件应谨慎处理

项目官方说明，Book to Skill 主要在本地读取文档并写入 Skill 目录，不会主动上传文件或运行网络服务。

不过，最终生成和调用 Skill 时是否会把内容发送给云端模型，还取决于你使用的 AI 工具和模型服务。

处理公司机密、客户资料或个人隐私文件前，应先确认对应 AI 服务的数据政策。

5. 不要直接相信网络视频中的 Star 数量

GitHub Star 会随时间变化。

与其在文章中写死“6.9K Star”或其他数字，不如直接查看项目仓库中的实时数据，避免文章发布后很快过时。

我的理解

Book to Skill 最有价值的地方，不是帮助我们更快地“读完一本书”，而是改变书籍知识的使用方式。

过去，一本书读完之后，真正能记住和使用的内容可能很少。

现在可以把书里的框架、规则和方法整理成一个 Agent Skill，让 AI 在写作、分析、策划和决策时按需调用。

它相当于把一本静态的电子书，变成一个可以查询、分析并参与工作的知识模块。

不过，它并不能代替阅读本身。

真正合理的用法，是让 AI 帮助我们定位知识、理解框架和应用方法，再回到原文核对上下文。这样既能提高学习效率，也能减少断章取义和错误理解。

项目地址

GitHub：

https://github.com/virgiliojr94/book-to-skill

项目名称：

`1`	`virgiliojr94/book-to-skill`

项目功能、安装方式和兼容范围可能继续更新，请以 GitHub 仓库中的最新 README 为准。

Codex 效率倍增：5 个值得关注的开源工具

Mon, 27 Jul 2026 19:40:00 +0800

同样使用 Codex，为什么有些人写代码更快、更稳，还能让 AI 自动查文档、理解大型项目，甚至操作浏览器和电脑？

原因并不只是模型更强，而是他们给 Codex 配置了更完整的工具链。

Codex 本身已经可以阅读代码、修改文件、运行命令和修复 Bug，但在实际使用中，仍然容易遇到以下问题：

没有理解完整需求，就直接开始写代码；
使用过时的技术文档，生成已经失效的 API；
一个简单功能引入大量依赖，代码越来越复杂；
项目文件太多，AI 反复搜索代码，消耗大量 Token；
AI 能分析问题，却无法操作浏览器或桌面软件。

下面介绍 5 个值得关注的开源项目。它们分别从开发流程、网页数据、代码精简、项目理解和电脑自动化五个方向，补足 Codex 的能力。

本文中的 GitHub Star 数量会随时间变化，因此不再使用固定数字作为主要判断标准。是否值得安装，还应结合项目更新频率、Issue、许可证和实际需求综合判断。

5 个工具分别解决什么问题？

工具名称	核心功能	主要解决的问题
Superpowers	为 AI 加入需求分析、开发计划、测试和代码审查流程	AI 没想清楚就直接写代码
Firecrawl	抓取网页并转换为 Markdown 或结构化数据	AI 使用过时文档或无法读取网页
Ponytail	强调标准库优先、最小实现和减少依赖	代码过度设计、项目越来越臃肿
Graphify	将代码库转换为本地知识图谱	大型项目难理解、反复搜索文件
Agent TARS	识别屏幕并操作鼠标、键盘和浏览器	AI 只能思考，不能完成界面操作

1. Superpowers：让 Codex 先分析，再写代码

很多 AI 编程任务失败，并不是因为模型不会写代码，而是因为它在需求还没有明确时，就直接开始修改项目。

例如，你只说一句：

给网站增加一个用户登录功能。

AI 可能马上创建数据库、安装认证框架、增加多个中间件，最后才发现你只需要一个简单的后台密码验证。

Superpowers 的作用，就是给 Codex、Claude Code 等 AI 编程工具增加一套更严格的软件开发流程。

它通常会引导 AI 按照以下步骤工作：

先分析用户需求；
主动询问缺失的细节；
输出开发方案；
将任务拆分成多个步骤；
编写测试；
实现功能；
运行测试；
检查代码质量；
完成代码审查。

它更像是一套 AI 开发规范，而不是简单的提示词模板。

Superpowers 适合解决什么问题？

如果你经常遇到下面这些情况，可以考虑使用 Superpowers：

AI 没理解需求就开始修改代码；
功能做出来了，但方向完全错误；
修改一个问题，却破坏了其他功能；
AI 写完代码后不测试；
大型任务执行到一半开始偏离目标；
希望 Codex 按测试驱动开发流程工作。

使用时需要注意

Superpowers 会让开发流程更加完整，但也会增加执行步骤。

如果只是修改一个按钮颜色、调整一段文字或修复简单配置，并不一定需要启动完整的需求分析和测试流程。

它更适合中等以上复杂度的开发任务。

2. Firecrawl：让 Codex 获取最新网页和技术文档

AI 编程工具经常会遇到一个问题：模型掌握的知识不是实时更新的。

当框架、云服务或第三方 API 更新后，Codex 可能仍然使用旧版本参数，甚至生成已经被删除的方法。

例如：

Next.js 更新了路由方式；
OpenAI API 修改了请求格式；
Cloudflare 增加了新的配置参数；
某个 JavaScript 库废弃了旧方法；
官方文档已经更新，但 AI 仍然按照旧教程回答。

Firecrawl 是一个面向 AI Agent 的网页抓取和数据提取工具。

它可以将网页内容整理成适合 AI 阅读的格式，包括：

Markdown；
HTML；
JSON；
结构化数据；
网页截图；
页面链接；
整站爬取结果。

普通网页中通常包含导航栏、广告、按钮、脚本和大量无关代码。

Firecrawl 会尽量提取正文内容，再转换成干净的 Markdown，让 Codex 更容易理解。

Firecrawl 可以怎么配合 Codex？

例如，你准备让 Codex 接入一个刚刚更新的 API。

可以先让 Firecrawl 抓取官方文档，再把整理后的内容交给 Codex。

这样，Codex 不需要完全依赖模型记忆，而是根据最新文档生成代码。

一个常见工作流程是：

抓取官方文档
↓
转换为 Markdown
↓
交给 Codex 阅读
↓
根据最新文档生成代码
↓
运行测试验证

Firecrawl 适合哪些场景？

获取最新 API 文档；
抓取产品页面；
整理公开数据；
分析竞争对手网站；
提取新闻和文章正文；
给 AI Agent 提供实时互联网内容；
将复杂网页转换成 Markdown。

使用时需要注意

Firecrawl 的核心项目是开源的，但官方提供的云端 API 服务可能存在免费额度和付费套餐。

因此，“项目开源”不代表所有在线调用都永久免费。

如果需要大量抓取，也可以研究自托管方案。

同时，抓取网站时应遵守目标网站的 robots.txt、服务条款和相关法律要求。

3. Ponytail：阻止 AI 把简单问题写复杂

Codex 在生成代码时，有时会出现明显的过度设计。

一个原本只需要十几行代码的小功能，AI 可能会：

新建多个文件；
引入新的第三方库；
创建多层抽象；
增加复杂配置；
设计未来可能永远不会使用的扩展接口；
把简单逻辑封装成多个类。

最终结果是代码看起来很专业，但维护成本越来越高。

Ponytail 的核心思想是：

没有明确需要的功能，就不要提前实现。

这也是软件开发中常见的 YAGNI 原则，即：

You Aren’t Gonna Need It。

Ponytail 会引导 AI 优先考虑以下问题：

这个功能真的需要新增代码吗？
项目中是否已经存在类似能力？
能否直接使用语言标准库？
能否使用平台原生功能？
是否真的需要安装第三方依赖？
是否可以使用更简单的实现？
是否正在为不存在的未来需求过度设计？

举一个简单例子

假设需求是读取一个 JSON 文件。

AI 可能建议安装额外的 JSON 处理库。

但对于 Python、JavaScript、Go 等语言来说，标准库本身已经具备 JSON 解析能力。

Ponytail 会优先让 AI 使用现有能力，而不是为了一个简单任务增加新的依赖。

Ponytail 适合哪些用户？

个人开发者；
小型项目；
快速验证产品；
希望减少依赖的团队；
经常使用 Codex 生成代码的用户；
发现项目越改越复杂的开发者。

使用时需要注意

代码少并不代表代码一定更好。

涉及以下内容时，不能为了减少代码而省略必要设计：

安全验证；
错误处理；
日志记录；
数据校验；
权限控制；
自动化测试；
长期维护需要的模块拆分。

Ponytail 的重点不是“强行减少代码行数”，而是减少没有实际价值的复杂度。

4. Graphify：让 Codex 快速理解大型项目

当项目只有十几个文件时，Codex 通常可以快速理解代码结构。

但如果项目包含几百个甚至几千个文件，AI 就需要不断执行：

搜索文件；
查找函数；
阅读调用关系；
打开配置文件；
查找数据库结构；
分析模块依赖；
重复读取相同代码。

这个过程不仅慢，还会消耗大量上下文和 Token。

Graphify 可以提前分析整个项目，并将项目内容转换为本地知识图谱。

它可以处理的内容包括：

源代码；
项目文档；
配置文件；
数据库 Schema；
Markdown；
PDF；
图片；
视频；
其他项目资料。

对于代码内容，Graphify 可以使用 Tree-sitter 进行结构化解析，从而识别：

文件之间的关系；
函数调用关系；
类和模块依赖；
代码入口；
数据流；
配置关联；
项目目录结构。

Graphify 能帮助 Codex 回答什么问题？

建立知识图谱后，可以让 AI 更快回答：

用户登录功能涉及哪些文件？
这个函数被哪些模块调用？
修改数据库字段会影响哪些页面？
项目入口文件在哪里？
支付流程经过哪些服务？
某个配置项会影响哪些组件？
这段代码是否存在循环依赖？
一个 Bug 可能来自哪些模块？

相比让 Codex 每次从头搜索整个项目，知识图谱能够提供更完整的项目上下文。

Graphify 适合哪些场景？

接手陌生项目；
分析大型代码仓库；
维护遗留系统；
阅读缺少文档的项目；
多个 AI Agent 协作开发；
进行代码影响范围分析；
降低重复读取项目文件的次数。

使用时需要注意

知识图谱只能帮助 AI 理解代码关系，不能替代真实测试。

即使 Graphify 判断某个函数只被三个模块调用，也仍然需要通过运行测试和实际环境验证修改结果。

另外，项目代码发生较大变化后，需要重新更新或增量更新知识图谱。

5. Agent TARS：让 AI 从思考走向操作

Codex 更擅长处理代码、命令行和文件。

但很多实际工作并不完全发生在终端中，例如：

打开网页后台；
点击菜单；
填写表单；
上传文件；
操作设计软件；
整理网页内容；
使用桌面应用；
在浏览器中完成多步骤任务。

Agent TARS 是字节跳动开源的多模态 AI Agent 项目。

它可以结合视觉模型、GUI Agent 和 MCP 工具，让 AI 尝试理解屏幕内容，并进行鼠标、键盘和浏览器操作。

它的能力方向包括：

识别页面按钮；
理解输入框和菜单；
点击网页元素；
输入文字；
操作浏览器；
调用 MCP 工具；
完成多步骤界面任务；
结合搜索、文件和网页工具工作。

Agent TARS 能做什么？

理论上，你可以给它一个任务，例如：

打开网站后台，找到最近发布的文章，并检查标题是否存在错别字。

AI 会尝试：

打开浏览器；
进入对应页面；
识别后台菜单；
找到文章列表；
打开文章；
分析页面内容；
返回检查结果。

这类工具让 AI 不再只是告诉你“应该点击哪里”，而是尝试直接执行界面操作。

Agent TARS 适合哪些场景？

浏览器自动化；
GUI Agent 研究；
网页后台操作；
重复性桌面任务；
多步骤资料整理；
Computer Use 测试；
MCP 工具调用。

使用时需要注意

不要把 Agent TARS 理解成可以完全放心接管电脑的工具。

GUI Agent 仍然可能出现：

点击错误位置；
误解页面内容；
输入错误信息；
删除不该删除的文件；
在错误账号中执行操作；
页面加载后判断失败；
执行高风险操作。

建议优先在以下环境中测试：

虚拟机；
测试账号；
低权限用户；
不包含重要文件的电脑；
隔离的浏览器环境。

涉及以下操作时，应保留人工确认：

发布内容；
删除文件；
修改账号；
发送邮件；
提交订单；
付款；
上传隐私文件；
修改服务器配置。

这 5 个工具应该怎么选择？

不需要一次性把所有工具全部安装。

更合理的方式是先找到自己当前最明显的问题，再选择对应工具。

AI 写代码经常跑偏

选择：

`1`	`Superpowers`

它适合帮助 Codex 先明确需求，再按照计划、测试和代码审查流程执行。

经常遇到过时 API 和技术文档

选择：

`1`	`Firecrawl`

它可以抓取最新官方文档，并转换成适合 AI 阅读的 Markdown。

AI 生成的代码越来越复杂

选择：

`1`	`Ponytail`

它会提醒 AI 优先使用现有代码、标准库和原生能力，减少不必要的依赖。

项目太大，Codex 总是找不到代码关系

选择：

`1`	`Graphify`

它可以将项目转换为知识图谱，让 AI 更快理解项目结构和调用关系。

希望 AI 操作浏览器和桌面软件

选择：

`1`	`Agent TARS`

它适合研究 GUI Agent、浏览器自动化和 Computer Use。

是否都支持 Codex、Cursor 和 Claude Code？

不能简单地理解成“安装一次，所有 AI 编程工具全部通用”。

不同项目的接入方式可能包括：

Agent Skills；
MCP Server；
CLI 命令；
API；
本地服务；
Docker；
插件配置；
自定义提示词；
项目规则文件。

例如，某个项目可能更适合 Claude Code，另一个项目可能主要通过 MCP 接入 Cursor，也可能需要手动配置 Codex。

因此，具体安装和兼容方式应以项目最新 README 为准。

使用开源 AI 工具前，建议检查这些内容

不要只看 GitHub Star 数量。

安装前建议重点检查：

1. 最近是否仍在更新

查看最近一次提交时间和版本发布时间。

如果项目长期没有维护，可能无法兼容最新 Codex、Cursor 或 MCP 协议。

2. Issue 中是否存在严重问题

重点关注：

安装失败；
数据泄露；
高 CPU 占用；
无法卸载；
Windows 兼容问题；
macOS 权限问题；
API Key 泄露；
项目无法启动。

3. 是否需要额外付费服务

有些项目本身开源，但可能依赖：

OpenAI API；
Claude API；
Gemini API；
Firecrawl 云服务；
向量数据库；
云服务器；
搜索 API。

因此，开源不一定等于零成本。

4. 是否会读取敏感代码

如果项目需要扫描整个代码仓库，要先确认数据是否只在本地处理。

涉及公司代码、客户项目或商业机密时，不要直接上传到不确定的第三方服务。

5. 是否拥有高权限

GUI Agent 和电脑自动化工具可能需要：

屏幕录制权限；
鼠标控制权限；
键盘控制权限；
浏览器访问权限；
文件系统权限。

安装前应明确它可以访问哪些数据。

总结

提升 Codex 的效率，并不只是更换一个更强的模型。

真正影响 AI 编程体验的，通常还有三件事：

是否有明确的开发流程；
是否能获得最新、准确的资料；
是否能快速理解当前项目。

Superpowers 负责规范开发流程，Firecrawl 负责获取实时网页和技术文档，Ponytail 负责控制代码复杂度，Graphify 负责理解大型项目，Agent TARS 则将 AI 能力扩展到浏览器和桌面操作。

但工具并不是越多越好。

更实际的做法是：

找到工作流中最浪费时间、最容易出错的一步，再安装对应工具。

如果 Codex 经常写错方向，就先解决需求分析问题。

如果 AI 经常引用过时 API，就先解决实时文档问题。

如果项目越来越复杂，就先限制过度设计。

如果大型项目理解困难，就建立本地知识图谱。

只有真正需要操作网页和电脑时，再考虑 GUI Agent。

GitHub 项目地址

Superpowers https://github.com/obra/superpowers
Firecrawl https://github.com/firecrawl/firecrawl
Firecrawl MCP Server https://github.com/firecrawl/firecrawl-mcp-server
Ponytail https://github.com/DietrichGebert/ponytail
Graphify https://github.com/Graphify-Labs/graphify
Agent TARS / UI-TARS Desktop https://github.com/bytedance/UI-TARS-desktop

Find Skills 使用教程：帮你搜索、筛选和安装合适的 AI Agent Skills

Mon, 27 Jul 2026 19:10:00 +0800

Skills 太多不知道装哪个？先用 Find Skills 帮你筛选

接触 Claude Code、Codex、Cursor 或其他 AI Agent 一段时间后，很多人都会遇到同一个问题：

可安装的 Skills 越来越多，但真正适合自己的却很难找。

看到别人推荐测试 Skills、SEO Skills、前端设计 Skills、亚马逊选品 Skills，很多新手的第一反应是全部收藏，或者看到一个就安装一个。

最后工具箱越来越大，真正使用的可能只有两三个。

与其花时间在 GitHub 和 Skills.sh 里逐个翻找，不如先安装一个专门帮助你寻找 Skills 的 Skills：Find Skills。

Find Skills 是什么？

Find Skills 的代码名称是 find-Skills，由 Vercel Labs 的 Skills 项目提供。

它不是用来替你写代码、做选品或制作视频的业务型 Skills，而更像一个 AI Skills 导航员。

它主要做三件事：

根据你的实际任务寻找相关 Skills；
对搜索结果进行初步筛选；
提供 Skills 的用途、来源和安装命令。

你只需要把需求说清楚，它就会帮助你缩小范围，而不是让你面对一长串不知道该怎么选择的 Skills。

为什么建议先安装 Find Skills？

真正的问题通常不是没有 Skills，而是 Skills 太多。

Skills.sh 是一个开放的 Agent Skills 目录，里面收录了大量可复用能力。Skills 可以理解为一组面向特定任务的操作说明、脚本和相关资源，用来教 AI Agent 按照相对固定的流程完成工作。

但 Skills 数量增加后，也会带来三个问题：

名称相似，不知道哪个更适合；
来源不同，质量差距较大；
安装太多后，管理和维护成本上升。

因此，Find Skills 的价值不只是“帮你搜索”，而是先理解任务，再帮助你判断哪些结果更值得进一步查看。

Find Skills 是怎么寻找 Skills 的？

根据其官方说明，Find Skills 通常会按照以下流程工作。

第一步：拆解你的真实需求

它会先判断：

你属于哪个领域；
你具体想完成什么任务；
这个任务是否可能已经有成熟的 Skills。

例如，“我想做亚马逊”范围太大。

更有效的表达是：

帮我寻找一个适合亚马逊产品研究的 Skills，重点关注关键词、竞品分析、市场需求和广告数据。

需求越具体，搜索结果通常越准确。

第二步：先查看热门 Skills

Find Skills 会先检查 Skills.sh 排行榜，看看相关领域是否已经存在安装量较高、使用较广的 Skills。

热门不代表一定适合你，但通常意味着有更多用户使用和验证，可以作为第一轮筛选依据。

第三步：使用关键词继续搜索

如果排行榜中没有合适的结果，它会使用 Skills CLI 继续搜索，例如：

`1`	`npx Skills find amazon product research`

Skills CLI 也支持直接按关键词搜索：

`1`	`npx Skills find typescript`

还可以限定 GitHub 用户或组织：

`1`	`npx Skills find react --owner vercel`

第四步：核对 Skills 的质量

Find Skills 不应该只根据搜索结果名称进行推荐，还会重点查看：

安装量；
作者或组织来源；
GitHub 仓库星标；
项目是否持续维护；
Skills 的实际用途；
是否与当前任务匹配。

官方指南建议优先考虑安装量较高、来源可信的 Skills；安装量很少、来源陌生或仓库维护不足的项目，则需要更加谨慎。

Find Skills 安装命令

可以使用下面的命令安装 Vercel Labs 提供的 find-Skills：

`1`	`npx Skills add vercel-labs/Skills --Skills find-Skills`

在支持指定 Agent 的环境中，也可以明确选择安装目标。例如安装到 Claude Code：

`1`	`npx -y Skills add vercel-labs/Skills --Skills find-Skills --agent claude-code`

执行方法很简单：

打开终端；
粘贴安装命令；
按下回车；
根据终端提示完成安装。

需要注意的是，不同 Agent 和 Skills CLI 版本的安装路径或参数可能有所区别。安装前可以先查看项目最新说明。

安装后怎么使用？

安装完成后，不需要记住复杂命令，可以直接使用自然语言描述需求。

例如：

帮我寻找一个用于前端自动化测试的 Skills，优先推荐来源可信、安装量较高并且仍在维护的项目。

或者：

帮我找一个适合独立站 SEO 内容分析的 Skills，需要支持关键词研究、竞品分析和内容缺口检查。

还可以进一步增加筛选条件：

请先说明每个 Skills 的用途、作者来源、安装量、GitHub 仓库情况和安装命令，不要直接安装，等我确认后再操作。

这样做可以避免 AI 搜到结果后立即安装，也方便你先比较不同选项。

哪些人适合使用 Find Skills？

Find Skills 并不只适合程序员。

程序员

可以寻找：

自动化测试 Skills
代码审查 Skills
Git 提交规范 Skills
React 或 Next.js 优化 Skills
部署和排错 Skills

跨境电商卖家

可以寻找：

亚马逊选品 Skills
关键词研究 Skills
竞品分析 Skills
Listing 优化 Skills
广告数据分析 Skills

内容创作者

可以寻找：

视频脚本 Skills
标题生成 Skills
SEO 内容优化 Skills
社交媒体分发 Skills
字幕和内容整理 Skills

个人网站站长

可以寻找：

技术 SEO 检查 Skills
网站性能优化 Skills
结构化数据 Skills
内容审查 Skills
Google Search Console 分析 Skills

核心原则只有一个：

不要按照 Skills 的名字搜索，而要按照自己准备完成的任务搜索。

安装第三方 Skills 前要注意什么？

Find Skills 可以帮你缩小范围，但不能代替最终的安全判断。

安装之前，建议至少检查以下内容：

查看作者来源

优先考虑官方组织、知名开发者或长期维护的开源仓库。

阅读 Skills.md

确认它会执行哪些步骤、调用哪些命令，以及是否会修改本地文件。

检查脚本和依赖

如果 Skills 带有 Shell、Python、JavaScript 脚本，应先查看脚本内容，不要直接运行来源不明的代码。

检查更新时间和 Issue

长时间没有更新、存在大量未处理问题的项目，需要谨慎安装。

不要一次安装几十个

先根据当前任务安装两三个真正需要的 Skills，使用一段时间后再决定是否保留。

Find Skills 和 `npx Skills find` 有什么区别？

两者都可以帮助你搜索 Skills，但使用方式不同。

npx Skills find 是直接在终端中搜索：

`1`	`npx Skills find seo`

Find Skills 则会先理解你的自然语言需求，再决定搜索哪些关键词，并帮助你整理和比较结果。

简单理解：

npx Skills find 是搜索工具；
Find Skills 是帮助你使用搜索工具的导航规则。

对于已经知道准确关键词的人，直接使用命令会更快。

对于不知道该搜什么、也不知道如何判断质量的新手，Find Skills 更容易上手。

我的使用建议

不要一开始就安装几十个 Skills。

更合理的顺序是：

先安装 Find Skills；
明确当前准备完成的任务；
让它推荐两到三个候选 Skills；
检查来源、安装量、仓库和脚本；
只安装真正适合当前工作的项目；
定期删除长期不用的 Skills。

Find Skills 节省的不只是搜索时间。

更重要的是，它可以减少无效安装，让你的 AI Agent 工具箱保持轻量，并把注意力重新放回真正需要完成的任务上。

项目地址

Find Skills GitHub 项目：https://github.com/vercel-labs/Skills/tree/main/Skills/find-Skills
Skills.sh：https://Skills.sh
Skills CLI 项目：https://github.com/vercel-labs/Skills

AI Agent on 拾光集

一句话克隆网站：AI Agent 像素级复刻工具

这个工具能做什么？

核心工作流程

1. 页面侦察

2. 提取设计规范

3. 下载真实素材

4. 生成组件规格

5. 并行生成代码

6. 视觉 QA

生成后的项目结构

如何使用？

准备条件

第一步：创建自己的项目

第二步：克隆自己的仓库

第三步：启动 AI Agent

第四步：运行网站克隆命令

第五步：运行项目

它适合哪些场景？

适合

不适合

使用前必须知道的限制

一句话总结

GitHub 项目

Codex + Obsidian 长期记忆配置：让 AI 跨项目记住工作进度和关键决策

一、Codex + Obsidian 的工作原理

二、推荐的 Obsidian 记忆库结构

三、配置 Codex 的 AGENTS.md

四、设置每日复盘

五、原生 Codex Memory 与 Obsidian 的区别

六、使用时需要注意的问题

不要保存敏感信息

不要无限追加笔记

重要操作仍需人工确认

七、适合使用这套方案的人

相关开源项目

Obsidian Mind

Obsidian Second Brain

Codex Obsidian Inspiration & Memory Loop

WorkBuddy + HyperFrames 安装教程：接入本地 Qwen3-TTS，实现自己的声音自动配音

一、三个工具分别做什么？

WorkBuddy

HyperFrames

Qwen3-TTS

二、安装前需要准备什么？

三、安装 Node.js

四、安装 FFmpeg

五、安装 WorkBuddy

六、使用 WorkBuddy 安装 HyperFrames

七、运行环境体检

八、预览和渲染视频

九、接入本地 Qwen3-TTS

十、让 WorkBuddy 编写桥接脚本

十一、一个容易忽略的问题：接口格式不一定相同

十二、生成自己的声音配音

十三、常见问题

1. 找不到 hyperframes 命令

2. FFmpeg 已安装，但终端仍然找不到

3. 浏览器下载失败

4. 视频有画面但没有声音

5. 字幕和配音不同步

6. 自己的声音不像

十四、这套方案适合谁？

总结

项目与官方地址

Headroom：最高减少 92% Token，用 AI 编程时别再把钱浪费在无效上下文上

Headroom 是什么？

实际能节省多少 Token？

压缩后会不会影响回答质量？

Headroom 支持哪些 AI 编程工具？

最简单的安装方法

在 Claude Code 中使用

在 Codex 中使用

跨 Agent 共享记忆

Headroom 适合哪些人？

使用前需要注意什么？

1. 最高 92% 不代表每次都能省 92%

2. 先在测试项目中验证

3. 本地运行不等于没有安全风险

4. 定期查看节省数据

1. 找不到 `hyperframes` 命令