game-engine

# Game Engine Skill Build web-based games and game engines using HTML5 Canvas, WebGL, and JavaScript. This skill includes starter templates, reference documentation, and step-by-step workflows for 2D and 3D game development with frameworks such as Phaser, Three.js, Babylon.js, and A-Frame. ## When to Use This Skill - Building a game engine or game from scratch using web technologies - Implementing game loops, physics, collision detection, or rendering - Working with HTML5 Canvas, WebGL, or SVG for game graphics - Adding game controls (keyboard, mouse, touch, gamepad) - Creating 2D platformers, breakout-style games, maze games, or 3D experiences - Working with tilemaps, sprites, or animations - Adding audio to web games - Implementing multiplayer features with WebRTC or WebSockets - Optimizing game performance - Publishing and distributing web games ## Prerequisites - Basic knowledge of HTML, CSS, and JavaScript - A modern web browser with Canvas/WebGL support - A text editor or IDE - Optional: Node.js for build tooling and local development servers ## Core Concepts The following concepts form the foundation of every web-based game engine. ### Game Loop Every game engine revolves around the game loop -- a continuous cycle of: 1. **Process Input** - Read keyboard, mouse, touch, or gamepad input 2. **Update State** - Update game object positions, physics, AI, and logic 3. **Render** - Draw the current game state to the screen Use `requestAnimationFrame` for smooth, br...