Quellinformationen
- Repository
- Tugoukezhang/workbuddy-skills
- Letzte Quellaktivität
- 18. Juni 2026 um 05:44
- Erkannte Sprache von SKILL.md
- Chinesisch
- Sterne
- 13
- Forks
- 3
Installationsoptionen
Standardmäßig ist der Prompt ausgewählt, der zuerst die Quelle prüft. Sie können zu einem direkten Befehl wechseln oder eine lokale Kopie herunterladen.
Quelldateien prüfen
Lesen Sie SKILL.md und alle von SkillsMP angezeigten Begleitdateien, bevor Sie sich für eine Installation entscheiden.
SKILL.md wird angezeigt
SKILL.md
Quellanweisungen · Schreibgeschützte Vorschau- name
- web-games
- description
- Web浏览器游戏开发 - 框架选择与浏览器特定原则，包括Phaser、PixiJS、WebGPU、优化、PWA。
- read_when
- ["开发Web/H5游戏时","选择游戏引擎时","优化Web游戏性能时"]
# Web Browser Game Development
## 框架选择
### 决策树
```
游戏类型？
│
├── 2D游戏
│ ├── 需要完整游戏引擎功能？ → Phaser
│ └── 追求原始渲染性能？ → PixiJS
│
├── 3D游戏
│ ├── 完整引擎（物理、XR）？ → Babylon.js
│ └── 专注于渲染？ → Three.js
│
└── 混合/Canvas
└── 自定义方案 → 原生 Canvas/WebGL
```
### 框架对比（2025年）
| 框架 | 类型 | 最佳适用场景 |
|-----------|------|----------|
| **Phaser 4** | 2D | 完整游戏功能 |
| **PixiJS 8** | 2D | 渲染、UI |
| **Three.js** | 3D | 可视化、轻量级 |
| **Babylon.js 7** | 3D | 完整引擎、XR |
## 性能原则
### 浏览器限制
| 限制 | 应对策略 |
|------------|----------|
| 无法访问本地文件 | 资源打包、CDN |
| 标签页节流 | 隐藏时暂停 |
| 移动数据限制 | 压缩资源 |
| 音频自动播放 | 需要用户交互 |
### 优化优先级
1. **资源压缩** - KTX2、Draco、WebP
2. **懒加载** - 按需加载
3. **对象池** - 避免垃圾回收
4. **绘制调用批处理** - 减少状态变更
5. **Web Workers** - 卸载重计算
## PWA 游戏
### 优势
- 离线游玩
- 安装到主屏幕
- 全屏模式
- 推送通知
### 要求
- Service Worker 缓存
- Web 应用清单
- HTTPS
> **记住：** 浏览器是最易访问的平台。尊重它的限制。
Auf GitHub ansehen