Simon Willison 用 Claude Code 打造 LaTeX renderer 在线渲染工具

工具 LaTeX 渲染器 —— LaTeX 渲染器将 LaTeX 源码转换为渲染后的视图，既可以是由 MathJax 排版的单个展示公式，也可以是由 faster-latex 排版的完整文档或散文片段，编辑器旁带有实时预览，工具栏可在 Edit 和 Rendered 视图之间切换。源码可以手动输入、从 URL 或 GitHub Gist 加载，或从内置示例中选取，页面会将 LaTeX 保存在 URL 片段中，因此可以以可读或压缩链接的形式分享。

受 Paul Ford 和 Aboard Foundary 的新 Web 应用 Tiny Little Office 启发，它提供了一套 Web 应用内容编辑器（文字处理器、大纲工具、演示文稿构建器、电子表格、计算器、绘图工具、图表制作器、动画工具、日历和旅行规划器）。

Tiny Little Office 的标志性技巧是将所有文档数据存储在 URL 的 #fragment 部分，因此用它创建的每个文档都会成为可收藏、可分享的链接。

它还有一个 llms.txt 文件，告诉智能体如何构造能渲染为文档的 URL。Claude 利用该文件生成了这个演示文稿链接，解释了 URL 格式的工作原理：

Tiny Little Office 启发我让 Claude Code（Opus 5.5 Extra）构建了一个类似的、可与 LaTeX 配合使用的工具。以下是我使用的提示词序列：

I want a tool where you can link to it with a fragment hash #code-here and it treats that code as LaTeX and renders it really effectively. It should also support a prefix which means the latex is compressed with a custom compression dictionary optimized for latex. Use the best available latex render library from a CDN (consider WebAssembly too). If loaded without a fragment hash show an editor you can paste latex into and then toggle to a "rendered" view. That rendered view should be bookmarkable. The #fragment view should let you switch to edit source too.

由于它是在我的 tools 仓库中工作的，我告诉它从现有的 SVG in Markdown 工具所使用的 <iframe sandbox="..."> 机制中汲取灵感，以防范 XSS 风险：

Safe from XSS? We could run in an iframe sandbox like we do on the SVG markdown render project

我还让它从那个工具中复制了 Gist/URL 加载功能：

We should have an option to load latex from a URL (or gist) similar to the markdown SVG tool

这是一个示例链接。该工具使用了 Pako 2.1.0、MathJax 4.1.3、faster-latex 0.3.1 和 DOMPurify 3.4.16。