소스 정보
- 저장소
- Tugoukezhang/workbuddy-skills
- 최근 소스 활동
- 2026년 6월 18일 05:44
- 감지된 SKILL.md 언어
- 중국어
- 스타
- 13
- 포크
- 3
설치 방법
기본적으로 소스를 먼저 확인하는 Prompt가 선택됩니다. 직접 명령으로 전환하거나 로컬 사본을 다운로드할 수도 있습니다.
소스 파일 검토
설치 여부를 결정하기 전에 SKILL.md와 SkillsMP에 표시된 보조 파일을 읽어 보세요.
SKILL.md 표시 중
SKILL.md
소스 지침 · 읽기 전용 미리보기- 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
> **记住：** 浏览器是最易访问的平台。尊重它的限制。
GitHub에서 보기