返回 文章 apply CMS 文章

用 Claude 将 Three.js 作品移植为原生 WebGL 的实践记录

一次由评论引发的动手实验：让 Claude 在同一对话线程中把 Three.js 3D 作品改写为不依赖 Three.js 的原生 WebGL 版本。

SIMON WILLISON'S
ClaudeThree.jsWebGLAI 编程
成长分 / 100 57 综合收获、行动、留存与影响

为什么值得读展示了大模型在同一对话上下文中完成跨技术栈代码移植的真实案例。

提供了可对比的两个在线成品与完整对话记录，便于自行判断差异。

关键洞察
  1. 作者受一条评论启发，当天早上用 Three.js 做了一个裸鳃类主题的法贝热彩蛋。
  2. 他在原本构建该作品的同一对话线程中，要求 Claude 将其移植为 Vanilla JS 版本。
  3. 两个版本并不完全相同，Claude 在对话记录中解释了差异原因，作者表示自己并未完全理解。
转成行动

深入阅读

正文与原文对照

原文保真覆盖：全文原文字符：1130

好，这条评论说服了我去试一试。

这是我今天早上用 Three.js 做的一个东西——一个以裸鳃类（Nudibranch）为主题的 Faberge Egg：https://static.simonwillison.net/static/2026/Hidden-Reef-Egg...（77KB）

我就在当初构建它的同一个对话线程里，让 Claude（在普通 Claude Chat 中运行的 Opus 5.5 Medium）把它移植到 Vanilla JS，得到了这个：https://static.simonwillison.net/static/2026/Hidden-Reef-Egg...（98KB）

两者并不完全相同——你可以在对话记录里看到 Claude 对此的说法（我也不完全明白为什么会有差异）：https://claude.ai/share/e56d163e-2793-4677-aa11-191d5058b414

不过确实，事实证明 Claude Opus 5.5 完全有能力在不使用 Three.js 的情况下，用 Vanilla JS + WebGL 进行 3D 建模。

粗略浏览代码后，我自己觉得 Three.js 版本稍微更容易理解一些，但我很少看这些 3D 项目的代码，所以这也不算特别重要。