文章总结： 本文指出在AI大模型频繁发布的背景下Three.js成为VibeCoding时代最大赢家。文章介绍Three.js是用于网页3D内容的JavaScript开源库优势在于易用轻量跨浏览器。它特别适合AI编程因为其内容为文本代码大模型擅长处理且可立即在浏览器运行。文章还介绍了根据图片生成Three.js模型的开源项目img2threejs。 综合评分： 65 文章分类： AI安全,安全工具,安全开发,WEB安全,其他

AI大模型发个不停，Three.js成为最大赢家

原创

轩辕之风 轩辕之风

轩辕的编程宇宙

2026年8月5日 17:24 四川

在小说阅读器读本章

去阅读

大家好，我是轩辕。

还记得那个鹈鹕骑单车的的动画吗：

过去有一段时间，每次有大模型发布，就有网友用它来生成这样的SVG动画。

因为大模型官方发布的benchmark和各种技术报告，大多数人是看不太进去的，所以用视觉化的呈现方式是最能直观呈现模型的进步能力的。

其中SVG动画就是一个非常有代表的类型，要生成这样的动画，会涉及大量几何数学的计算，并且可以所见即所得，所以大家都倾向于做这种动画来测试模型的Coding能力。

不过最近几个月，情况变了。

主角换成了另一个：Three.js。

最近我就看到了一个帖子：Vibe Coding时代最大赢家是Three.js。

估计连Three.js团队自己也没有想到，能在AI编程时代起飞。

鹈鹕骑单车这样的SVG动画大家已经看腻了，而3D动画看起来就比2D的高端大气上档次，难度也会更大，所以现在看到的各路测评基本上都是用3D案例了。

有人做 3D 地球，有人做粒子动画，有人做小游戏，层出不穷。

这类作品也特别容易传播。

一段十几秒的录屏，就能把动画、材质、交互和画面效果全部展示出来。即使不懂代码，也能直接看到结果。

而这些作品背后使用的基本上都是Three.js。

Three.js 是什么？

Three.js 是一个用 JavaScript 开发网页 3D 内容的开源库。

它的优势是易用、轻量、跨浏览器、通用的 JavaScript 3D 库，采用 MIT 许可证，在GitHub上有114K的Star。

浏览器本身可以通过 WebGL 和 WebGPU 调用显卡，但直接使用底层图形接口，需要处理大量细节。

Three.js 对这些能力做了封装。开发者可以直接创建场景、模型、灯光、材质、摄像机和动画。

Three.js 可以做什么？

Three.js 最常见的用途，是在网页中展示 3D 内容。

例如汽车、手机、鞋子和机械设备，都可以做成能够旋转和缩放的在线模型。

很多品牌官网也会使用 Three.js。用户滚动页面时，模型可以跟随进度移动、拆解或者切换材质。

数据可视化也是常见场景。

地图轨迹、天体运动、粒子系统、网络拓扑和建筑结构，都可以做成可交互的 3D 页面。

Three.js 也能开发浏览器小游戏，包括跑酷、赛车、射击、迷宫和各种物理交互。

不过它主要解决 3D 渲染问题，并不是完整的游戏引擎。

复杂游戏需要的物理系统、关卡管理、联网、资源管理和业务逻辑，通常还要配合其他工具完成。

为什么它特别适合 AI 编程？

传统 3D 项目经常需要在 Blender、Maya 等软件里制作模型，再导出文件交给开发者使用。

Three.js 还支持另一种做法，直接通过代码创建几何体、曲线、粒子、材质和动画。

这部分内容全是文本代码，正好属于大模型擅长处理的形式。

代码生成后可以立即放进浏览器运行。Agent 也可以查看运行截图，根据画面继续调整坐标、材质和灯光。

整个过程不一定需要提前准备 3D 模型文件。

对那些用来展示模型能力的短 Demo 来说，这种开发方式速度很快。开发者给出需求，模型生成代码，运行后继续修改，很快就能得到一个可分享的链接。

Three.js 已经发展了很多年，这一轮 AI 编程热潮又给它带来了大量新用户和新作品。

一张图片生成 Three.js 模型

最近还有一个很火的开源项目，叫 img2threejs。

https://github.com/img2threejs/img2threejs

它可以根据一张物体参考图，生成能在浏览器里运行的程序化 Three.js 模型。

这个项目里面有一个SKILL，只需要把GitHub链接发给Codex，就能安装这个SKILL。

安装之后，就能把图片发给它让它做3D模型了。

比如这是我之前在泉州玩的时候，拍的一张开元寺的古塔照片：

直接把这张图发给Codex，让它基于img2threejs这个SKILL做一个3D模型：

如果你也有制作简单3D模型的需要，可以用这个SKILL来试一试。

或者如果你想做3D动画，可以直接告诉你的Agent：使用Three.js给我实现xxx。

好了，今天就分享到这里。

如果觉得还不错的话，求个点赞。

路过的朋友欢迎点个关注呗，及时获得下期文章推送~

往期推荐

• 10分钟速通Claude Code泄露源码核心架构！
• 我做了一个Claude Code模拟器，可视化呈现与AI的每一步交互！
• 手把手带你用AI开发一个代码全景图分析智能体，一键分析GitHub项目！
• 一句话让AI生成科普动画，做动画视频太简单了！
• Agent Skills技术到底是什么，一个动画彻底搞懂！
• Gemini3现在能做这种地图轨迹动画了，免费就能体验！
• 如何学习操作系统？
• 程序员赛道太卷，逆向工程师怎么样？

免责声明：

本文所载程序、技术方法仅面向合法合规的安全研究与教学场景，旨在提升网络安全防护能力，具有明确的技术研究属性。

任何单位或个人未经授权，将本文内容用于攻击、破坏等非法用途的，由此引发的全部法律责任、民事赔偿及连带责任，均由行为人独立承担，本站不承担任何连带责任。

本站内容均为技术交流与知识分享目的发布，若存在版权侵权或其他异议，请通过邮件联系处理，具体联系方式可点击页面上方的联系我。

本文转载自：轩辕的编程宇宙 轩辕之风 轩辕之风《AI大模型发个不停，Three.js成为最大赢家》