【AI】为什么 AI 开发的 3D 游戏大多基于 Three.js

简介: 本文探究 AI 生成 3D 游戏普遍默认选用 Three.js 的缘由:项目搭建简便、网络训练样本充足、浏览器运行带来简短调试反馈链路。该选择不代表技术最优,主流游戏引擎的 AI 配套工具链尚不成熟


图片名称
  ◆ 博主名称: QuZhengRong

  AI俘虏,样式苦手

⭐️ LuckReport专栏LuckReport

⭐️ SpringBoot专栏SpringBoot

⭐️ SpringCloud专栏SpringCloud


目录

图片名称

最近视频网站给我推送了不少 Claude Fable 5 和 Kimi K3 生成的游戏 —— Minecraft 克隆、太空射击、赛博朋克城市,效果都挺不错的。输入几句话,让编码 Agent 运行几个小时,就能跑出一个看起来还不错的 demo。但刷多了就发现一个规律:这些 3D 游戏几乎大部分都基于 Three.js

市面上已经有 Unity3D、Unreal 这些成熟的游戏引擎,为什么 AI 在没指定技术栈的情况下,默认会选 Three.js 来开发 3D 游戏?

一、构建简单

Three.js 项目构建起来非常的简单,先建一个 HTML 文件,再通过 CDN 或 NPM I 引入 Three.js,增加些 JS 或者 TS 脚本,项目的骨架就搭建好了,打开浏览器就能运行

对比一下其他引擎。Unity 项目的文件要按目录组织,C# 脚本、预制体、场景文件、资源配置互相关联,涉及的文件广度深度复杂度远超 Three.js,还得用 Editor 编译,缺了东西就跑不起来。Unreal 更复杂,.uproject 加上 C++ 构建系统加上 Blueprint 资源,而且 Unity 和 Unreal 的纹理、模型、音频这些二进制资源还得走导入管线处理。相对来说 Three.js 的构建要简单的多

<!-- Three.js 运行示例 -->
<script type="importmap">
{
    
  "imports": {
    
    "three": "https://cdn.jsdelivr.net/npm/three@0.185.0/build/three.module.js"
  }
}
</script>
<script type="module">
  import * as THREE from 'three';
  const scene = new THREE.Scene();
  const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
  const renderer = new THREE.WebGLRenderer();
  renderer.setSize(window.innerWidth, window.innerHeight);
  document.body.appendChild(renderer.domElement);
  const geometry = new THREE.BoxGeometry();
  const material = new THREE.MeshStandardMaterial({
     color: 0x00ff00 });
  const cube = new THREE.Mesh(geometry, material);
  scene.add(cube);
  scene.add(new THREE.AmbientLight(0xffffff, 0.4));
  const dirLight = new THREE.DirectionalLight(0xffffff, 1.0);
  dirLight.position.set(5, 10, 7.5);
  scene.add(dirLight);
  camera.position.z = 5;
  renderer.setAnimationLoop(() => {
    
    cube.rotation.x += 0.01;
    renderer.render(scene, camera);
  });
</script>

二、训练数据里 Three.js 最多

Three.js 在 Web 3D 领域有绝对的话语权:

  • NPM 周下载量 400 多万人次,Babylon.js 的 @babylonjs/core 不到它的十分之一
  • 开放网络上超过 70% 的 3D 内容是 Three.js 渲染的,从 Apple 产品页到独立浏览器游戏都有
  • GitHub 上 Three.js 相关仓库数量比 Babylon.js、PlayCanvas 这些加起来还多

Three.js 有完善的教程、网上的 Stack Overflow 问答、GitHub 开源项目也不少,这些内容被爬进训练集之后,Three.js 的代码样本比其他 3D 库和引擎多得多。让模型搭建一个 3D 游戏,它大概率会选 Three.js,因为参数里的3D游戏和 Three.js 一起出现的频率最高。

DAIR.AI 的 Elvis Saravia 评价 Fable 5 是"生成 3D 模拟/世界的最强 LLM ",他演示用的就是 Three.js:

“Fable 5 is an absolute beast at threejs. It’s the best LLM at generating 3D simulations/worlds.”

参考:DAIR.AI Demos Fable 5 Generating Interactive 3D Worlds

三、反馈链路短

基于 Three.js 生成的游戏可以在浏览器里运行,从生成代码到看到效果,中间步骤少,通过截图和 DevTools 即可观察渲染效果,有完整的调试和修正回路。

Kimi K3 的发布博客里提到,模型生成代码后会截图看渲染效果,再根据截图修正代码。浏览器环境下这个流程非常顺畅:

1、模型生成 Three.js 代码

2、代码在浏览器中渲染 3、截图捕获渲染结果 4、模型分析截图,判断是否符合要求 5、修正代码,ReStart

参考:Kimi K3 Uses Three.js WebGPU for an AI-Built 3D Game Demo

四、总结

Three.js 成为 AI 生成游戏的默认选择,原因如下:

1、构建简单,HTML + JavaScript 就能搞定 2、训练数据多,模型熟悉 Three.js 3、反馈链路短,浏览器截图配置 DevTools 快速调试

不过这也说明 AI 选 Three.js 做 3D 游戏并不是因为它最适合,而是因为 Unity 和 Unreal 的 AI 开发路线尚不成熟。

目前 AI 生成的 Three.js 作品大部分都是 demo 级别的,想要让 AI 生成企业级别的游戏,还有待 Unity MCP 、Unreal 插件的工具链的发展,让 AI 能操作编辑器、读取场景结构、理解资源引用,等工具链成熟之后,AI 在引擎里的成功率会提高不少

当然,游戏最重要的还是玩法,缺少有趣的灵魂,拿 AI 做出来的东西也只是电子废料,在 AI 时代,创意既昂贵,也廉价

五、LuckReport 项目推荐

在这里插入图片描述

导航:LuckReport专栏

1、项目简介

Luck-Report 是一款基于开源项目 UReport2 重构的 Java 高性能报表引擎,通过迭代单元格可以实现任意复杂的中国式报表。相较于 UReport2,Luck-Report 在技术架构上进行了全新升级,后端基于 SpringBoot 框架开发、前端采用 Vue 框架构建,技术选型贴合当下主流项目开发标准,可精准适配各类实际开发需求。

Luck-Report 提供了全新的基于网页的报表设计器,可以在 Chrome、Firefox、Edge 等各种主流浏览器运行(IE 浏览器除外)。使用 Luck-Report,打开浏览器即可完成各种复杂报表的设计制作。

Luck-Report 基于 Apache-2.0 开源协议 开源

2、在线体验

相关文章
|
24天前
|
人工智能 IDE Java
2026年AI编程工具混战:Java开发者的终极答案,藏在IDEA插件和专属引擎里
2026年7月AI编程工具激战正酣:IDEA 2026.2原生集成Copilot、Trae 3.0破500万月活、Kimi K3万亿参数模型登顶榜单。但热潮之下,通用工具难解Java工程师理解老项目、对齐规范、工程交付等真实痛点——真正提效的,是深度融入IDEA、专注Java工程全链路的专属引擎。
|
24天前
|
人工智能 安全 前端开发
AI编程两年走完四个阶段,Java程序员该升级什么能力?
AI编程已从“行内补全”跃迁至“工程化交付”,历经补全、生成、Agent、工程化四阶段。核心不再比速度,而在于开发者能力模型能否同步进化——从“会写”转向“会判、会改、会控”。Java工程师尤需强化需求定义、架构判断与质量兜底能力。
|
24天前
|
人工智能 小程序 前端开发
微信小程序里的 AI 美妆服务怎么落地?
微信小程序凭借免下载、高触达优势,成为AI美妆服务理想载体。本文详解AR虚拟试妆、AI肌肤检测、粉底色号匹配三大能力,解析“前端+后端+AI+推荐”四层架构,强调后端统一封装的安全性与业务可控性,并给出落地路径与隐私合规建议。(239字)
116 0
|
24天前
|
运维 监控 网络协议
SAE健康检查失败怎么办?阿里云国际版(云老大):端口、探针与日志排查全攻略
SAE 应用在发布或运行中突然被标记为“健康检查失败”,进而触发容器重启,是不少运维团队经常踩到的坑。这类问题表面上看是探针没通过,但背后往往藏着端口配置、探针参数或启动时序配合上的细节。要理清“阿里云SAE健康检查失败排查方法”,不能只盯着失败事件本身,得回到容器启动链路和探针机制上,把常见的故障模式一一拆开。
271 0
|
24天前
|
人工智能 测试技术
想进阿里,投递前先搞懂:它到底需要哪些人
阿里不止电商!涵盖阿里云、通义千问、菜鸟、高德、饿了么等多元业务。本图解帮你厘清:①阿里核心业务版图;②技术/测试开发/产品运营岗适配方向;③简历、项目与面试准备要点。实习&校招前必看,提升投递效率!
|
24天前
|
BI 定位技术 数据安全/隐私保护
同城O2O系统开发流程解析:需求分析、功能规划与上线步骤
本文围绕同城O2O系统开发流程展开,介绍需求分析、功能规划、技术开发和上线验证等关键环节,帮助理解本地生活类平台从设计到落地的完整路径。
|
24天前
|
应用服务中间件 Linux 网络安全
【2026最新】Nginx下载安装图文保姆级教程(Windows+Linux)
本文详解Nginx下载安装与配置:涵盖Windows绿色部署及Linux源码编译(含依赖安装、模块定制、启动验证),提供官方纯净资源包,附端口冲突解决与核心配置说明,助你快速上手高性能Web服务器。
|
25天前
|
人工智能 Linux API
零配置兼容!CC Switch让Codex CLI无缝调用DeepSeek模型教程
在AI开发与编程辅助场景中,Codex CLI凭借强大的代码生成、调试与工程化能力,成为开发者的高效工具。但Codex原生仅支持特定模型生态,无法直接对接DeepSeek等第三方大模型,核心障碍在于**协议不兼容**:Codex采用Responses API格式,而DeepSeek等主流第三方模型仅支持Chat Completions API格式。
304 0
人工智能 Java BI
1041 1