Spiderbench 是一个基于浏览器的 3D 蛛网摆荡/城市穿梭游戏与技术演示项目,主要用于展示 Claude Code 生成实时 3D 游戏代码、资产、着色器和程序化城市内容的能力。项目使用 JavaScript 与 Three.js/WebGL2,包含第三人称摆荡、墙跑、攀附、俯冲、程序化曼哈顿风格城市、复杂渲染管线以及 Blender 脚本生成的模型与动画。该项目明确声明为非商业粉丝项目和基准演示,不适合商业分发或商业使用。
适用领域
Web 3D 游戏 / Three.js / WebGL2 / 实时渲染 / 程序化城市生成 / 游戏物理与动画状态机 / AI 生成代码与资产展示 / 浏览器性能基准
配置难度
中高。运行项目本身较简单,只需 Node.js 和现代浏览器;但要深入理解或二次开发,需要掌握 Three.js/WebGL2、实时渲染、游戏物理、动画状态机、性能优化和浏览器图形调试。
商业价值
商业价值主要体现在技术研究、团队学习、Web 3D 性能验证、AI 辅助游戏开发评估和原型参考上。由于项目明确限制非商业用途,并涉及知名 IP 相关元素,不适合直接用于商业发行或产品集成。对于中国开发者而言,它更适合作为学习 Three.js 高级游戏工程、程序化城市生成和 AI 生成内容能力的参考案例。
01
技术亮点
- 完整的浏览器实时 3D 城市穿梭游戏演示,而不仅是简单 demo
- 包含较复杂的移动系统:蛛网摆荡、墙跑、攀附、拉拽、俯冲等
- 程序化曼哈顿风格岛屿,包含街道网络、建筑、屋顶、公园、时代广场、桥梁、车辆和行人
- 渲染管线较丰富,支持级联阴影、屏幕空间全局光照、环境光遮蔽、反射、Bloom、TAA、运动模糊、昼夜和雨夜场景
- 模型、动画、纹理、广告素材等资产具备 AI/脚本生成特色,适合研究 AI 辅助内容生产
- 项目星标数较高,说明在 Web 游戏和 AI 生成项目社区中有一定关注度
- 安装运行方式简单,适合快速体验和代码研究
02
目标用户
- Web 3D 开发者
- Three.js/WebGL 开发者
- 游戏开发学习者
- 对 AI 辅助开发感兴趣的工程师
- 实时渲染和浏览器性能优化研究者
- 希望研究程序化城市与角色移动系统的开发者
03
配置要求
- Node.js 20.19+ 或 22.12+
- 支持 WebGL2 的浏览器
- 推荐使用独立显卡,因为场景复杂、渲染特效较多
- 本地开发服务器默认访问 http://127.0.0.1:5173
- 游戏内按 H 查看控制说明
- 开发服务器中按 ~ 可打开开发者菜单
- 生产构建中如需开发者菜单,可在 URL 后添加 ?dev
04
适用场景
- 学习浏览器中实现第三人称 3D 动作游戏的工程结构
- 研究 WebGL2/Three.js 高级渲染效果,如级联阴影、屏幕空间 GI、AO、反射、Bloom、TAA 和运动模糊
- 参考蛛网摆荡、墙跑、俯冲、攀附等移动机制的实现思路
- 测试本机浏览器和 GPU 在复杂 Web 3D 场景下的性能
- 研究程序化城市、交通、行人、建筑和街区布局生成
- 评估 Claude/AI 辅助生成游戏代码和资产的实际能力
05
部署与配置
- 安装 Node.js,要求版本为 20.19+ 或 22.12+
- 准备支持 WebGL2 的现代浏览器,建议使用 Chrome、Edge 或 Firefox 的较新版本
- 克隆仓库:git clone https://github.com/xikhar/spiderbench.git
- 进入项目目录:cd spiderbench
- 安装依赖:npm install
- 启动开发服务器:npm run dev
- 在浏览器打开:http://127.0.0.1:5173
- 生产构建:npm run build,构建产物位于 dist/ 目录
06
风险与注意事项
- 许可证信息在仓库元数据中为 NOASSERTION,且 README 明确表示不得商业使用、不得销售、不得商业再分发,商业项目需谨慎
- 涉及 Spider-Man、Marvel、Daily Bugle、Oscorp 等相关名称或概念,存在版权和商标风险
- 项目是非官方粉丝技术演示,不应作为商业游戏或可分发产品基础直接使用
- 对 GPU 和浏览器性能要求较高,低端设备可能帧率较差或无法正常运行
- AI 生成代码和资产可能存在一致性、可维护性、版权来源和质量不稳定问题
- 复杂渲染和游戏逻辑可能导致调试难度较高
- 仓库描述、主题和许可证元数据不完整,企业合规审查成本较高
2026-09-30
第29名
新收录 · github_search