القائمة
Web browser game development principles. Framework selection, WebGPU, optimization, PWA.
Use when CrossFrame Suite routes explicit Chinese casebook work: turning materials into reusable cases, anonymized entries, mechanisms, and retrieval indexes.
Use only when the user explicitly names crossframe-critical for a Chinese structural critique dossier, article plan, or long-form critical essay.
Use when CrossFrame Suite routes explicit Chinese proposition testing, debate analysis, hidden-premise review, rebuttal design, or withdrawal condition checks.
Use when CrossFrame Suite routes explicit Chinese reader replies, editor responses, consultation-style short answers, or boundary-aware structural advice.
Use when explicit CrossFrame work needs a Chinese critical insight essay, commentary, concept essay, public piece, or structure-to-article draft after diagnosis.
Use when CrossFrame Suite routes explicit Chinese notes for books, theories, articles, excerpts, bidirectional reading, absorption, or conflict mapping.
| name | web-games |
| description | Web browser game development principles. Framework selection, WebGPU, optimization, PWA. |
| risk | unknown |
| source | community |
| date_added | 2026-02-27 |
Framework selection and browser-specific principles.
What type of game?
│
├── 2D Game
│ ├── Full game engine features? → Phaser
│ └── Raw rendering power? → PixiJS
│
├── 3D Game
│ ├── Full engine (physics, XR)? → Babylon.js
│ └── Rendering focused? → Three.js
│
└── Hybrid / Canvas
└── Custom → Raw Canvas/WebGL
| Framework | Type | Best For |
|---|---|---|
| Phaser 4 | 2D | Full game features |
| PixiJS 8 | 2D | Rendering, UI |
| Three.js | 3D | Visualizations, lightweight |
| Babylon.js 7 | 3D | Full engine, XR |
| Browser | Support |
|---|---|
| Chrome | ✅ Since v113 |
| Edge | ✅ Since v113 |
| Firefox | ✅ Since v131 |
| Safari | ✅ Since 18.0 |
| Total | ~73% global |
navigator.gpu| Constraint | Strategy |
|---|---|
| No local file access | Asset bundling, CDN |
| Tab throttling | Pause when hidden |
| Mobile data limits | Compress assets |
| Audio autoplay | Require user interaction |
| Type | Format |
|---|---|
| Textures | KTX2 + Basis Universal |
| Audio | WebM/Opus (fallback: MP3) |
| 3D Models | glTF + Draco/Meshopt |
| Phase | Load |
|---|---|
| Startup | Core assets, <2MB |
| Gameplay | Stream on demand |
| Background | Prefetch next level |
| ❌ Don't | ✅ Do |
|---|---|
| Load all assets upfront | Progressive loading |
| Ignore tab visibility | Pause when hidden |
| Block on audio load | Lazy load audio |
| Skip compression | Compress everything |
| Assume fast connection | Handle slow networks |
Remember: Browser is the most accessible platform. Respect its constraints.
This skill is applicable to execute the workflow or actions described in the overview.