Core Concepts
Understanding the fundamental building blocks of KernelPlay.js.
🎮 Game
The main entry point. Manages the game loop, scenes, and rendering. Configure FPS, canvas size, and renderer type.
🎭 Scene
Contains entities and manages updates, rendering, collisions, and raycasting. Think of it as a level or game state.
📦 Entity
A game object that holds components. Entities have tags and layers for organization and collision filtering.
🔧 Component
Behaviors attached to entities. Includes transform, renderer, collider, rigidbody, and custom script components.
The Entity-Component Pattern
KernelPlay.js uses an Entity-Component architecture (ECS-inspired). Instead of deep inheritance trees, you compose behavior by attaching components.
const enemy = new Entity("Enemy");
enemy.tag = "enemy";
enemy.layer = 2;
// Add components to define behavior
enemy.addComponent("transform", new TransformComponent({ position: { x: 200, y: 100 } }));
enemy.addComponent("renderer", new BoxRenderComponent({ color: "red" }));
enemy.addComponent("collider", new ColliderComponent());
enemy.addComponent("script", new EnemyAI()); // custom script
scene.addEntity(enemy);