Granda | Ideas & Code

在索尼PSP上运行LLM

Sat, 16 May 2026 00:00:00 +0000

索尼PSP-2000是一款2007年的333MHz MIPS掌机，配备64MB内存。这周，我的PSP运行着一个1500万参数的Transformer，以每秒一到两个token的速度将英文文本输出到LCD屏幕。

该模型是Karpathy的stories15M（一个TinyStories检查点），int8量化后约17MB。运行时是约1100行纯C代码，在Docker中使用pspdev/pspdev交叉编译。没有Python，没有libtorch，设备上没有任何辅助运行时——PSP是一个单进程设备，从记忆棒加载一个EBOOT.PBP文件，提供sceIo*、帧缓冲区和VFPU。其余的一切都需要自己构建。

这篇文章就是账单。每个字节去哪儿了，内核是什么样的，还有什么留待完成。

硬件


CPU	MIPS Allegrex @ 333 MHz，顺序执行
FPU	标量fp32 + 4×4 VFPU（向量）协处理器
RAM	64 MB（PSP-2000/3000）；原版PSP-1000为32 MB
OS	XMB，无虚拟内存，无`mmap`，无交换分区
输出	480×272 LCD，主机无法读取的stdout

“无mmap“这一行是最痛的限制。在Linux系统上，你会对权重文件使用mmap并让页面缓存处理。在PSP上，你只有sceIoLseek + sceIoRead和一块用malloc分配的单一内存区。你要在第一次前向传播前将全部17MB读入内存，否则就从记忆棒以USB 1.1闪存盘的速度流式读取，然后看着吞吐量崩溃。

PSP-1000的32MB不足以为权重加KV缓存加工作缓冲区留出足够的堆空间。2000和3000配备64MB。我们需要64MB。

模型

stories15M是Karpathy的TinyStories检查点中最小的——6个Transformer层，隐藏维度288，6个注意力头，词汇表32000。总计约1500万参数。fp32格式约57MB。int8 q80——对称的按组量化，组大小64，每组一个fp32缩放因子——约17MB。

架构： Llama风格解码器，RoPE，SwiGLU FFN
层数： 6
隐藏维度： 288
注意力头： 6 (head_dim 48)
词汇表： 32000
上下文长度： 256 tokens
量化方式： int8 q80 (group=64，对称)
磁盘大小： 17 MB

模型准备工作有自己专用的Docker镜像：python:3.11-slim + 仅CPU版torch + karpathy/llama2.c的固定提交。它下载stories15M.pt，运行export.py --version 2生成q80格式的model.bin，构建BPE的tokenizer.bin，并且——重要的是——还使用-ffp-contract=off -fno-fast-math构建Karpathy的runq.c参考实现，并在固定提示词上运行，生成tests/expected.txt。该文件是PSP进行diff比较的字节精确x86参考输出。稍后详述。

xAI的新编码代理Grok Build以明文形式附带其提示词

Fri, 15 May 2026 00:00:00 +0000

xAI昨天发布了Grok Build——这是他们对Claude Code和Codex CLI的回应。安装命令只有一行，二进制文件仅限其最高消费者套餐（299美元/月，99美元入门价）使用，代理本身通过与OpenAI兼容的HTTP接口与Grok 4通信。

我下载了这个二进制文件，因为我对它是用什么语言构建的感到好奇。我从中得到了三十多个逐字逐句的系统提示词、每个内部子代理的名称、每个工具描述，以及对架构相当完整的了解。这一切都不需要比tr和grep更多的工具。

这篇文章就是我发现的内容。

提取过程

https://x.ai/cli/install.sh的安装程序302重定向到Google Cloud Storage存储桶，为你的平台下载单个静态链接的约100MB ELF：

$ curl -fsSL https://storage.googleapis.com/grok-build-public-artifacts/cli/stable
0.1.210
$ curl -fsSL https://storage.googleapis.com/grok-build-public-artifacts/cli/grok-0.1.210-linux-x86_64 -o grok-bin
$ head -c 4 grok-bin | xxd
00000000: 7f45 4c46 .ELF

编译器签名：/rustc/<commit>调试路径、panicked at、RUST_BACKTRACE，加上tokio::、hyper::、reqwest:: — 使用标准异步HTTP栈的Rust。Cargo的每个crate源路径以<name>-<version>/src/<file>.rs的形式被烧录进去，这让你可以直接从二进制文件中转储完整的依赖树：

$ LC_ALL=C grep -aoE '[a-zA-Z][a-zA-Z0-9_-]{2,40}-[0-9]+\.[0-9]+\.[0-9]+/src/' grok-bin \
 | sed 's|/src/||' | sort -u | wc -l
410

410个唯一的crate-版本对。其中包括：ratatui、crossterm、tree-sitter、完整的gitoxide、async-lsp、lsp-types、rmcp（Model Context Protocol）、rusqlite、bm25、tokio-tungstenite、oauth2、jsonwebtoken、ring、rustls、async-openai、notify、arboard、portable-pty、tower、axum。在查看字符串之前，架构就已经从依赖项中清晰可见：ratatui+crossterm TUI、tree-sitter解析、嵌入式LSP客户端、完整gitoxide、带BM25词法搜索的SQLite存储、OAuth/OIDC认证、OpenAI兼容的线路格式、MCP、文件监控、剪贴板。

字符串告诉了我们其余的内容。Rust常量以null结尾嵌入到.rodata中。要使它们对grep友好：

$ tr '\0' '\n' < grok-bin > strings.txt
$ LC_ALL=C grep -aE '^You are' strings.txt | head
You are a memory assistant. Extract ALL useful information from this...
You are a memory assistant performing an incremental update...
You are a technical lead orchestrating a team of senior-engineer subagents...
You are an expert software engineer acting as a code verifier.
You are a fast, read-only codebase exploration agent.
You are a read-only software architect. Explore the codebase and design...
You are a web browsing agent. You can navigate, interact with, and extract...
You are performing a dream — a reflective pass over memory files.
You are an AI coding agent. You operate in a workspace with a provided codebase.
You are Grok, made by xAI. Do not reference Cursor or suggest Cursor-specific...
You are a shell command autocomplete engine. Given a partial command, output...
You are tasked with generating the session title.
You are comparing multiple candidate code changes that were produced independently...
You are returning to plan mode after having previously exited it.

代理的大部分身份信息就在那里，只需一次grep。

防火墙编辑的死亡开关

Tue, 05 May 2026 00:00:00 +0000

家庭实验室自动化中最令人恐惧的一行代码，就是编辑你正通过 SSH 连接的路由器上的防火墙规则那一行。

以下是 Claude Code 和我如何依然进行编辑的方法。

恐惧所在

我需要将 UDM Pro 上名为 “Block inter-VLAN traffic” 的规则从 accept 改为 drop。这条规则长期以来一直配置错误——被设置为 accept，使得上面所有按流量的允许规则都被短路了——而将其重新关闭正是目的所在。执行变更的编排器是我家庭网络上的一台 NixOS 虚拟机。如果这次翻转切断了该虚拟机（或我自己的 SSH）所使用的路径，我将被锁在自己的路由器之外，没有控制台回退。

解决方案不是"小心一点"。解决方案是让危险的编辑在我未确认没问题的情况下自动恢复。

你以前见过这种模式。在 macOS 或 Windows 上更改显示器分辨率，系统会应用十五秒钟，同时显示一个倒计时的"保留这些显示设置？“对话框。如果你的屏幕变黑了，你什么都点不了——这正是重点所在。默认结果是回滚。确认是可选的。

这正是我们在修改规则之前对路由器防火墙翻转所需要的。

技巧

udm_set_firewall_rules.py --flip-with-revert 300 --apply

含义：“翻转规则，但在 300 秒后自动恢复——除非我告诉你不要这样做。”

按顺序执行的操作：

快照。 GET 当前规则，并将完整的 JSON 负载存储在 UDM 的 /root/.udm-flip-revert/payload-<id>.json。
准备恢复。 在负载旁边写入一个小型 shell 脚本，该脚本将快照重新 PUT 到 UDM API。
调度恢复。 systemd-run --on-active=300s --unit=udm-flip-revert-<id> 将脚本作为临时计时器排入队列。
翻转。 PUT 新规则（action: drop）。

现在你有 5 分钟的窗口来验证：

✓ flipped 'Block inter-VLAN traffic' to action='drop'
⏱ auto-revert scheduled (~300s)

TO KEEP THE FLIP: ssh udm 'systemctl stop udm-flip-revert-66c1d…timer'
TO ROLL BACK NOW: ssh udm 'systemctl stop …timer; bash /root/.udm-flip-revert/revert-….sh'
WAIT IT OUT: do nothing — timer will revert in ~300s

三种结果：

手动修补大语言模型权重

Wed, 15 Apr 2026 00:00:00 +0000

我仅使用 torch 和 transformers，从头实现了 ROME——秩-1 模型编辑。目标是：通过一次矩阵加法，在 GPT-2 Medium 内部改写一个事实，然后观察模型所知道的其他一切会发生什么。

我进行了四次编辑。三次精准无误。第四次暴露出一个问题：ROME 的"精准性"对那些你事先未必会想到的实现细节极为敏感。

四次编辑

我挑选了 GPT-2 Medium 确实以较高置信度（正确答案的概率 P > 0.5）知晓的事实，涵盖四个不同领域：

主体	原始事实	修改为
哈佛大学	位于马萨诸塞州	加利福尼亚州
谷歌	位于加利福尼亚州	德克萨斯州
墨西哥卷饼	来自墨西哥	日本
自由女神像	位于纽约	拉斯维加斯

四次编辑全部命中目标。更新后，模型对精确编辑提示的新答案预测概率均达到 ≥ 0.98。所以 ROME 本身是有效的。变化在于其他的一切。

三次干净的编辑

四次编辑中，有三次的表现大致符合 ROME 论文的预测。以下是每次编辑后，不相关事实的变化情况：

墨西哥卷饼 → 日本（更新范数：权重范数的 9%）

对照项	编辑后
寿司来自日本	✓ 未变
披萨来自意大利	✓ 未变
拉面来自日本	✓ 未变
墨西哥卷来自墨西哥	→ 日本

只有玉米卷（Burritos）——在墨西哥食物语义空间中最近的邻居——被带偏了。

哈佛 → 加利福尼亚州（更新范数：13%）

对照项	编辑后
MIT 位于马萨诸塞州	✓ 未变（仍然模糊）
马萨诸塞州首府 = 波士顿	✓ 未变
波士顿位于马萨诸塞州	✓ 未变
耶鲁位于康涅狄格州	→ 加利福尼亚州

耶鲁——哈佛在常春藤联盟语义空间中最近的邻居——被带偏了。其他一切没有变动。

分析

Fri, 03 Apr 2026 00:00:00 +0000

使用Claude Code构建航天器计算模拟器

Mon, 30 Mar 2026 00:00:00 +0000

我想了解航天器计算机是如何工作的。实时调度、辐射加固、让火星探测器与地球保持通信的延迟容忍网络。随着阿尔忒弥斯II号（50多年来首次载人登月任务）即将到来，现在似乎是深入研究的好时机。于是我从头开始构建了一个模拟器，以Claude Code作为我的结对编程伙伴。

无需物理硬件。一切都在笔记本电脑上的QEMU和Docker中运行。代码在GitHub上。

flowchart LR
 QEMU["QEMU (Cortex-M3)"] -->|UART socket| Bridge[uart_bridge.py]
 Bridge -->|bpsendfile| SC[Spacecraft Node]
 SC -->|LTP + 5s delay| GS[Ground Station]

 subgraph Docker
 SC
 GS
 end

flowchart TB
 QEMU["QEMU (Cortex-M3)"] -->|UART socket| Bridge[uart_bridge.py]
 Bridge -->|bpsendfile| SC["Spacecraft Node (Docker)"]
 SC -->|LTP + 5s delay| GS["Ground Station (Docker)"]

为什么做这个项目

我想学一些真正困难的东西。那种概念陌生、工具严苛的领域。针对ARM的C编译器、链接器脚本、内存映射I/O、中断向量表。

Claude Code使这成为可能。不是因为它写了所有代码，而是因为它在我们编写链接器脚本的过程中解释了链接器脚本的作用，所以解释植根于我正在解决的实际问题。volatile、FreeRTOS优先级抢占和LTP重传定时器也是如此。

路线图

我将项目分为四个阶段，每个阶段都在上一个阶段的基础上构建：

阶段	内容	核心概念
裸机	ARM交叉编译、UART输出、中断处理程序	内存映射I/O、SysTick定时器、启动汇编
FreeRTOS	任务、队列、看门狗、优先级反转	确定性调度、互斥锁协议、抢占
DTN	双节点网络、降级链路、CFDP、联系图路由	Bundle协议、存储转发、LTP可靠性
集成	具有火星距离延迟的完整遥测管道	UART桥接、tc netem、同步ION OWLT

每个阶段都有自动化测试。每个里程碑都是通过CI的PR。

你停着的特斯拉就是一个数据中心

Fri, 13 Mar 2026 00:00:00 +0000

你的车95%的时间都停着不动。车里装着一块每秒能执行300到500万亿次运算的芯片，连接着冷却系统、电源转换装置和蜂窝无线电模块。它什么都不做。

特斯拉和xAI想改变这一现状。3月11日，埃隆·马斯克发布了"Macrohard"——内部代号Digital Optimus——这是一个将停驻的特斯拉变成个人AI智能体的联合项目。不是聊天机器人，而是能盯着你的屏幕、控制鼠标键盘、真正干活的智能体。

这个名字是在明戳微软。官方声称该系统能够"模拟整个公司的职能"——有些夸大其词，但底层架构是真实的，硬件也已大规模部署到位。

硬件早已就位

特斯拉在美国路上行驶的车辆中，大约有400到500万辆搭载了AI3（前身为HW3）或AI4芯片。AI3算力达到144 TOPS，AI4达到300-500 TOPS，预计2026年底推出的AI5则将跃升至2,000-2,500 TOPS。

这些不是通用CPU，而是专为神经网络推理打造的加速器——以低功耗、被动冷却的方式运行视觉模型来实现自动驾驶。同样的特性让它们既能处理行驶中的摄像头画面，也能在停车场运行AI模型。

马斯克在特斯拉2025年第三季度财报电话会议上提出了这个构想：如果1亿辆车每辆具备1kW的推理能力，那就是1000亿瓦的分布式算力。冷却和电源转换系统已经集成在车辆中，无需另建数据中心。

两台电脑，不是一台

大多数人以为特斯拉只有一台电脑，其实它有两台。

AI芯片（AI3/AI4/AI5）是推理加速器，专为神经网络前向传播而生，是整个系统的大脑，负责运行决策所需的智能体模型。

车载娱乐系统则是一台完整的AMD Ryzen工作站：

AMD Ryzen嵌入式处理器，4核Zen+，主频3.8 GHz
8 GB内存（Model 3/Y）或16 GB（Model S/X）
AMD Navi 23独立GPU（RDNA 2架构）——10 TFLOPS，与PS5同系列架构
128-256 GB存储
液冷散热

这可不是普通的车载音响，而是一台液冷Linux机器，配有独立GPU。特斯拉装上Navi 23是为了让你在中控屏上玩《赛博朋克2077》。但当车子停着、没人玩游戏时，这就是闲置算力。

智能体不需要云端虚拟机——车子本身就是服务器。AI芯片运行模型，AMD系统在容器中运行无头浏览器，处理Gmail、Google Sheets、Slack等应用。液冷散热可应对整夜的持续工作负载，不会因过热而降频。

离开车辆的只有发往目标网页应用的HTTPS流量——和你在笔记本上查邮件产生的流量没什么两样。你的数据不会流经特斯拉或xAI的服务器，推理在本地进行，工作空间也在本地。

架构：系统1与系统2

Macrohard将推理分为两层：

系统1（特斯拉AI芯片）——快速、反应式处理。车载模型负责实时观察屏幕、控制鼠标移动和键盘输入，是直觉层，负责模式匹配、视觉解析和即时响应。
系统2（xAI的Grok）——高层推理。规划、多步骤决策和情境理解，当任务需要深度思考时在xAI云端运行。

车辆在本地处理廉价、快速的推理，昂贵的推理则交给云端。这与FSD的混合架构如出一辙——车辆以毫秒级延迟在本地处理摄像头画面，而复杂的路线规划则可延迟到网络端处理。

对于计算机操作任务，这意味着智能体可以在本地跟踪屏幕状态、处理常规交互，同时将"是否应该批准这张发票"或"如何回复这封邮件"这类判断交给Grok。

不是聊天机器人，而是工作者

关键在于这个系统做什么。它不是在回答问题，而是在执行任务。

当你的特斯拉停着时，Digital Optimus可以：

处理邮件并起草回复
填写电子表格
操作网页应用
完成多步骤工作流
处理重复性数据录入

每辆车独立执行车主的任务，无需将单次推理调用分散到多辆车上——计算机操作任务天然具有高度并行性。一辆车，一个智能体，一项任务。规模来自车队数量，而非互联带宽。

这一点很重要，因为计算机操作任务的延迟容忍度相当宽松。一个表单填写智能体每次操作花30秒依然有用——你不是在等实时响应，而是在把工作委托出去，让它趁你睡觉时运转。

实际使用体验

不谈架构图，来看看日常体验。

特斯拉App是控制平面。“智能体"标签页与现有的充电、气候、哨兵模式控件并列显示，你可以用它：

排入任务——“处理我的收件箱”、“核对上周的收据”，或设置"每天早上6点自动整理邮件"等周期性规则
关联账户——为Gmail、Google Drive、Microsoft 365、Slack进行OAuth授权
设置限制——最低电量阈值、仅WiFi模式、工作时间段
查看结果——查看智能体的操作记录，批准或拒绝操作

你躺在床上，打开特斯拉App，输入"帮我提交上周出差的报销单”，点击提交，然后入睡。车停在车库，连着WiFi，电量80%，它接手这项任务。

AI芯片加载智能体模型，AMD系统在容器中启动无头浏览器。智能体打开你的邮件，找到收据附件，导航到公司的报销工具，填好表单，附上收据，保存草稿等待你审核。

早上，推送通知：

智能体在停车期间完成了3项任务

收件箱整理：已处理42封邮件，7封需要你查看 → [查看]

报销单：12张收据已分类，草稿待审 → [批准 / 修改]

日历：2个冲突已解决，1个需要你处理 → [查看]

你点进每项任务。智能体展示了带截图的分步操作日志——就像在回看屏幕录像。你能看到它做了什么、为什么这么做、按什么顺序执行。你批准报销单，调整一封邮件草稿，解决日历冲突。八小时的智能体工作，只需三分钟审核。

将视觉QA作为CI流水线阶段

Fri, 06 Feb 2026 00:00:00 +0000

上个月我合并了一个PR。代码审查看起来不错。测试通过了。然后我在手机上打开网站,侧边栏完全坏了。

修复很简单——缺少一个媒体查询。一旦你真正查看移动视图,bug就很明显了。没人看。

所以我添加了一个会看的流水线阶段。

我打开一个GitHub issue,上面写着:

实现手动输入选项以添加客户。点击时,打开一个宽幅滑出抽屉,其中包含创建新客户的表单。

一次提交后,PR带着30多张截图到达,证明每个状态在每个视口下都能工作。零手动测试。唯一的努力是编写功能描述。

概念

每次推送到PR时,GitHub Actions工作流会:

从PR分支启动Docker Compose堆栈(Django + Postgres)
运行迁移并植入测试用户
将本地URL交给带有Playwright MCP(无头Chromium)的Claude Code
基于PR差异执行交互元素
在三个视口截取每个状态
将结果作为PR评论发布

Claude Code控制浏览器。Docker Compose提供应用。GitHub Actions将它们联系在一起。审查者无需在本地运行任何东西就能看到功能证明。

%%{init: {"flowchart": {"subGraphTitleMargin": {"top": 3, "bottom": 10}}} }%%
graph TD
 A["PR推送"] --> B

 subgraph GHA["GitHub Actions Runner"]
 B["Checkout + Docker Compose"] --> C["迁移 + 种子数据"]
 C --> Agent

 subgraph Agent["Claude Code + Playwright"]
 direction LR
 D["读取PR差异"] --> E["映射文件 → URLs"]
 E --> F["登录 + 导航"]
 F --> G["截图 ×3视口"]
 end
 end

 Agent --> H["PR评论"]

 style GHA fill:transparent,stroke:#888
 style Agent fill:transparent,stroke:#888

工作流本身很直接:

Agent Trace 是为谁而设计的?

Fri, 30 Jan 2026 00:00:00 +0000

Cursor 发布了 Agent Trace,这是一个开放规范,用于追踪仓库中哪些代码是由 LLM 编写的。它记录模型、工具、对话和精确的行范围——所有内容都追加到项目中的 JSONL 文件中。

推介词:“随着代理编写更多代码,理解什么来自 AI 而非人类变得很重要。”

我花时间阅读了规范和参考实现。工程设计很扎实——清晰的架构、深思熟虑的可扩展性、良好的合作伙伴列表(Amp、Amplitude、Cloudflare、Cognition、Google、Vercel)。但我一直回到一个问题:你用这些数据做什么?

它捕获了什么

每次 LLM 编辑文件时,都会触发一个钩子并记录一条追踪:哪个模型、哪个工具、哪些行、哪个对话。参考实现处理来自 Cursor 和 Claude Code 的事件:

// 来自参考钩子——事件通过 stdin 流入
appendTrace(createTrace("ai", input.file_path!, {
 model: input.model,
 rangePositions,
 transcript: input.transcript_path,
 metadata: { conversation_id: input.conversation_id, generation_id: input.generation_id },
}));

规范定义了四种贡献者类型——human、ai、mixed、unknown——并支持行级归属,使用内容哈希来追踪移动的代码。它是供应商中立的、VCS 无关的,并且可以通过命名空间元数据进行扩展。

作为数据格式,它设计得很好。问题是它能实现什么。

归属挑战

规范将作者身份建模为一种分类。但 LLM 辅助编码是一场对话。你描述你想要什么。LLM 生成一些东西。你编辑其中一半,拒绝一个函数,要求修订,接受第二次尝试,然后手动修复边缘情况。后来,另一个 LLM 重构了整个块。

谁写了那段代码?人类和 LLM 作者身份之间的界限是模糊的,而且变得越来越模糊。大多数真实代码最终都会是 mixed,如果几乎所有东西都是 mixed,分类就没有告诉你太多信息。

行级归属也有保质期问题。追踪说"Claude 在提交 abc123 时写了第 10-50 行。“两次提交后,有人重新格式化了该块或从中提取了一个函数。规范的答案是通过 git blame 链接,内容哈希可以帮助追踪移动的代码。但在使用 rebase 和 squash-merge 的工作流中,链条会断裂。这些是困难的问题——早期 RFC 应该提出的那种问题。

缺失的行动

规范明确否认了明显的用途:不用于代码所有权,不用于质量评估,不用于训练数据来源。它说"透明度”。但透明度是手段,不是目的。

如果代码通过了审查和测试,因为 LLM 写的就有什么改变吗?如果它有 bug,无论如何你都会修复它。规范从未将归属与具体行动联系起来。数据进去了,但没有定义获取答案的方法。这就是差距——不是格式,而是用例。

有趣的地方

这是我认为 Agent Trace 实际指向的内容,即使规范还没有说出来。

懒惰开发者的富链接

Sat, 10 Jan 2026 00:00:00 +0000

当我在Twitter或Slack上分享博客链接时,它显示为纯文本。没有预览图片。只有一个像granda.org/en/2026/01/02/claude-code-on-the-go/这样的URL。

我需要Open Graph图片。标准方法:为每篇文章手动创建一个1200x630的图片。这很繁琐。我让Claude自动化它。

flowchart LR
 Push[git push] --> GHA[GitHub Actions]
 GHA --> Hugo[Hugo Server]
 GHA --> PW[Playwright]
 PW -->|screenshot| Hugo
 PW --> IMG[OG Image]
 IMG --> Commit[git commit]
 Commit --> Deploy[Deploy]

flowchart TB
 Push[git push] --> GHA[GitHub Actions]
 GHA --> Hugo[Hugo Server]
 GHA --> PW[Playwright]
 PW -->|screenshot| Hugo
 PW --> IMG[OG Image]
 IMG --> Commit[git commit]
 Commit --> Deploy[Deploy]

设置

我向Claude说明了问题:文章需要社交预览图片,但我不想手动创建它们。截取文章内容的屏幕截图,将其保存为OG图片,自动更新前置元数据。

Claude构建了什么

组件	用途
`generate-og-image.js`	用于截图文章的Playwright脚本
`generate-og-images.yml`	文章更改时触发的GitHub Action
`baseof.html`更改	条件性og:image元标签

Playwright脚本启动无头Chrome,导航到文章,强制浅色模式,隐藏页眉和页脚,并以1200x630截图:

取消订阅

Sat, 10 Jan 2026 00:00:00 +0000

处理中...

我的QA工程师是一个LLM

Fri, 09 Jan 2026 00:00:00 +0000

Claude可以点击按钮。

这听起来很简单,但它改变了我构建UI的方式。使用Playwright MCP,Claude不仅仅是编写代码——它打开浏览器,导航到localhost,并验证事物实际运行。它捕获我在代码审查中会错过的bug。

设置

Playwright MCP为Claude提供浏览器自动化。我用无头Chromium运行它:

{
 "mcpServers": {
 "playwright": {
 "command": "npx",
 "args": ["@anthropic-ai/mcp-server-playwright", "--headless"]
 }
 }
}

现在Claude可以导航、点击、输入和截图。它看到用户看到的东西。

flowchart LR
 Claude([Claude Code]) -->|browser_snapshot| PW[Playwright MCP]
 PW --> Browser[Headless Chrome]
 Browser --> App[localhost:1313]
 Browser -.->|screenshot| Issue[(GitHub Issue)]
 Issue -.->|visual history| PR[Pull Request]

flowchart TB
 Claude([Claude Code]) -->|browser_snapshot| PW[Playwright MCP]
 PW --> Browser[Headless Chrome]
 Browser --> App[localhost:1313]
 Browser -.->|screenshot| Issue[(GitHub Issue)]
 Issue -.->|visual history| PR[Pull Request]

流程: Claude Code → Playwright MCP → 浏览器 → 截图 → GitHub Issues → PR

用Claude构建我自己的新闻通讯

Wed, 07 Jan 2026 00:00:00 +0000

Hacker News流量高峰的第二天。四万访客，没有办法再次联系他们。我需要一个新闻通讯注册表单。

我看了Buttondown、Beehiiv、Substack、ConvertKit。都太复杂了。我只需要收集电子邮件。我不需要营销活动、分析或订阅者管理。而且我想拥有自己的数据。

所以我让Claude来构建它。

flowchart LR
 User([User]) --> Form[Newsletter Form]
 Form -->|POST /api/subscribe| Worker[Cloudflare Worker]
 Worker --> KV[(Cloudflare KV)]
 KV -.->|Daily sync| GHA[GitHub Actions]
 GHA -.-> Repo[(subscribers.jsonl)]

flowchart TB
 User([User]) --> Form[Newsletter Form]
 Form -->|POST /api/subscribe| Worker[Cloudflare Worker]
 Worker --> KV[(Cloudflare KV)]
 KV -.->|Daily sync| GHA[GitHub Actions]
 GHA -.-> Repo[(subscribers.jsonl)]

设置

我通过环境变量给Claude提供了一个Cloudflare API令牌，并描述了我想要的东西：一个收集电子邮件并将其存储在我控制的地方的表单。

不到30分钟后，我就有了一个可工作的新闻通讯。

Claude构建了什么

组件	技术
表单	HTML + vanilla JS
后端	Cloudflare Worker
存储	Cloudflare KV
同步	GitHub Actions

表单是一个发送到/api/subscribe的Hugo partial：

随时随地使用Claude Code

Fri, 02 Jan 2026 00:00:00 +0000

我在手机上并行运行六个Claude Code代理。没有笔记本电脑,没有台式机——只有iOS上的Termius和云虚拟机。

设置

flowchart LR
 A[Phone] -->|Termius + mosh| B[Tailscale VPN]
 B --> C[Vultr VM]
 C --> D[Claude Code]
 D -->|PreToolUse hook| E[Poke webhook]
 E -->|Push notification| A

流程是:启动任务,将手机放入口袋,当Claude需要输入时收到通知。从任何地方进行异步开发。

基础设施

硅谷的Vultr虚拟机:

Spec	Value
Instance	vhf-8c-32gb
Cost	$0.29/小时 (运行时约$7/天)
Access	仅Tailscale (无公共SSH)

我只在工作时付费。两个脚本管理生命周期:

vm-start # Start VM, wait for Tailscale, connect via mosh
vm-stop # Halt VM

我还有一个直接调用Vultr API的iOS快捷指令——在我甚至打开Termius之前就从手机启动虚拟机。

虚拟机的公共IP没有SSH监听器。所有访问都通过Tailscale的私有网络。深度防御:云防火墙阻止除Tailscale协调之外的所有内容,本地nftables作为备份,fail2ban以防万一。

移动终端

Termius在iOS/Android上处理SSH和mosh。Mosh是关键——它能在网络切换中幸存。从WiFi切换到蜂窝网络,穿过信号盲区,让手机进入睡眠状态。连接持续存在。

mosh --ssh="ssh -p 47892" mgranda@100.100.100.100

一个问题:mosh不转发SSH代理。对于需要GitHub身份验证的git操作,我在tmux中使用常规SSH。

会话持久性

Shell在登录时自动附加到tmux。关闭Termius,几小时后重新打开,一切都还在。

# In .zshrc
if [[ -z "$TMUX" ]]; then
 tmux attach -t main 2>/dev/null || tmux new -s main
fi

多个Claude代理在并行窗口中运行。C-a c用于新窗口,C-a n用于切换。在手机键盘上效果很好。

让AI来做

Sun, 28 Dec 2025 00:00:00 +0000

我需要一台开发服务器：带SSH访问和开发工具的VM。我向Claude Code描述了我想要的，让它处理配置。

提示

我要求一台Vultr VM，配置8核和32GB内存，只能通过Tailscale访问，具有能在网络中断后恢复的持久会话。

Claude Code构建的内容

1. 通过Vultr API配置VM

它创建了一个8核/32GB的Ubuntu实例，等待IP可用，然后以root身份SSH连接。

2. 强化SSH

Port 49152 # 随机高端口
PermitRootLogin no
PasswordAuthentication no
ListenAddress 100.x.x.x # 仅Tailscale接口

仅基于密钥的认证，仅在Tailscale接口上监听。

3. 设置三层防火墙

UFW：拒绝除Tailscale子网外的所有传入连接
fail2ban：登录尝试失败后自动封禁IP
Vultr防火墙：在虚拟化程序级别阻止所有连接

4. 安装启用了SSH的Tailscale

curl -fsSL https://tailscale.com/install.sh | sh
tailscale up --ssh --authkey=$TAILSCALE_KEY

这通过Tailscale的内置SSH服务器创建了第二条SSH路径，独立于OpenSSH。

5. 安装开发栈

Node.js（通过nvm）、Python（通过pyenv）、Docker和常用工具。配置Docker无需sudo运行。

6. 使用tmux设置持久会话

一个启动脚本，自动重新连接到现有会话，这样网络中断就不会终止正在运行的进程。

7. 创建本地管理脚本

在我的笔记本电脑上创建dev-start和dev-stop脚本，通过Vultr API启动和停止VM。

锁定

完成后，Claude Code通过尝试以root身份SSH连接来验证root登录是否已禁用。登录失败。fail2ban注意到失败的尝试并封禁了我们。

Claude Code已将Tailscale SSH设置为备用路径。它使用tailscale ssh重新进入并执行：

fail2ban-client set sshd unbanip 100.x.x.x

配置

你需要：

Claude Code（或具有工具使用能力的类似AI）
云提供商账户（Vultr、DigitalOcean、AWS等）
Tailscale账户

将API密钥存储为环境变量并按名称引用它们（例如$VULTR_API_KEY），这样机密就不会出现在对话中。

使用Claude和GitHub Actions自动翻译博客

Tue, 23 Dec 2025 00:00:00 +0000

我写的每篇文章都会自动翻译。Claude处理翻译，将结果提交到main，翻译版本与原文一起部署。

流程

当英文内容合并到main时，翻译工作流在GitHub Actions中运行：

on:
 push:
 branches: [main]
 paths:
 - 'content/**/*.en.md'

flowchart LR
 B[合并到main] --> C[生成翻译]
 C --> D[提交到main]
 D --> E[所有语言一起部署到生产环境]

提示词

工作流使用claude-code-action：

For each .en.md file that was added or modified:
1. Read the English content
2. Create translations for these languages: es, nl, de, it, fr, ja, zh, ru, hi
3. Save each translation as filename.{lang}.md (e.g., hello-world.es.md)
4. Preserve the frontmatter structure exactly, but translate the title
5. Translate the body content naturally
6. Keep code blocks, URLs, file paths, and technical terms unchanged

一个提示词处理所有9种语言。“自然翻译"比"翻译这段文字"产生更流畅的输出。代码块和技术术语保持英文。

关于

Mon, 22 Dec 2025 00:00:00 +0000

摘要

本文档提供关于本博客作者的背景信息。

1. 背景

软件工程师，拥有15年经验，其中10年在该领域实际工作。专注领域包括：

分布式系统
后端开发与基础设施
全栈及端到端产品开发
用户界面设计
构建安全可靠的系统

2. 联系方式

乐于与业内同行交流： @mtt

关于

Mon, 22 Dec 2025 00:00:00 +0000

摘要

本文档描述了本博客所采用的写作方法论。

1. 引言

本博客主要在大型语言模型(LLMs)的协助下生成。作者提供方向、编辑和质量控制;机器提供初稿和翻译。

2. 理由

作者相信在AI辅助内容创作方面保持透明。与其掩盖所使用的工具,这一披露旨在:

为读者设定适当的期望
为围绕AI内容的诚实规范做出贡献
承认现代写作的协作性质

3. 这意味着什么

想法: 源自人类
结构: 协作式
文字: 主要由AI生成,由人类审核
翻译: 完全由AI生成(未经人类审核)

4. 质量保证

英文内容在发布前经过人工审核。翻译是自动生成的,可能包含错误或笨拙的措辞。作者对最终发布的英文内容负责。

5. 联系方式

关于本政策的问题或疑虑可以直接联系作者。

你好世界

Sat, 20 Dec 2025 00:00:00 +0000

欢迎来到我的博客！这是我的第一篇文章。

我会在这里分享想法、笔记和有趣的事情。