GLM-5 与 Qwen3.5 双模型对比:一句话生成 HTML 小游戏实战
项目背景
最近尝试了多款开源大模型,覆盖文本生成、代码开发等多个领域。作为一个开发者,我萌生了一个想法:能不能用 AI 双模型并行生成游戏,让用户对比投票选择最佳版本?
这个实验的核心价值在于横向对比两个模型的优劣,同时通过一次请求获得两个版本的代码,效率翻倍。
玩法与技术架构
核心流程
操作很简单:输入游戏描述(比如'打地鼠'),两个模型同时生成,左右并排展示效果,用户觉得哪个好就投一票。
技术栈
| 层级 | 技术 | 说明 |
|---|---|---|
| 前端 | Vue 3 + Vite | 响应式框架 + 构建工具 |
| 后端 | Fastify | 高性能 Node.js 框架 |
| AI | GLM-5 / Qwen3.5 | 通过 API 调用 |
| 安全 | iframe sandbox | 沙箱隔离,防止恶意代码 |
项目结构
ai-game-generator/
├── client/ # 前端
│ ├── src/
│ │ ├── App.vue
│ │ └── main.js
│ └── vite.config.js
├── server/ # 后端
│ ├── src/
│ │ ├── config.js
│ │ ├── index.js
│ │ ├── routes/generate.js
│ │ └── services/
│ │ ├── model.js
│ │ └── cache.js
│ └── package.json
└── .env.example
核心实现细节
1. 提示词工程
想让模型生成能直接跑的游戏,提示词挺关键的。我试了几版,最后定型是这样的:
const GAME_PROMPT_TEMPLATE = `
你是一个 HTML 小游戏生成引擎。
严格要求:
1. 只输出完整 HTML 文档
2. 必须包含 <!DOCTYPE html>
3. 内嵌 CSS
4. 内嵌 JS
5. 不允许 Markdown
6. 不允许解释
7. 不允许外链资源
8. 代码必须可直接运行
9. 游戏必须有交互逻辑
用户需求:{userPrompt}`;
主要就几点:明确告诉它是'游戏生成引擎',禁止输出废话,要求单文件,复制就能跑。
2. 双模型并行调用
这里的关键是并发请求。我们使用 Promise.all 来同时发起对两个模型的调用,减少等待时间。
// server/src/services/model.js
async function callAIModel(prompt, modelConfig) {
const response = await fetch(, {
: ,
: {
: ,
:
},
: .({
: modelConfig.,
: [{ : , : systemPrompt }],
: ,
: modelConfig.,
:
})
});
( response.());
}
() {
[resultA, resultB] = .([
(prompt),
(prompt)
]);
{ : resultA, : resultB };
}


