Lets make a game

ECS is the new black!

PostMap

• 1. Introduction
• 2. Requirements
• 3. Stack
  • ecsy
  • ecsy + PixiJS
  • ecsy + Planck.js

Introduction

Requirements

Entity can be added to the world, removed from the world at any arbitrary time. Entity's propterties can be added, removed, modified at any arbitrary time. New entity type can be added to the system relatively independently from existing entities' types.

Up to 500 dynamic entities. Up to 5000 static entities.

Can use any HTML5 APIs, including DOM: receive and emit events, synchronize DOM elements with game state:

• button, clicking on which will start simulation, summon entities, e.t.c
• text element that display count of enemies

Can be integrated into the larger Web System: React/Angular/Vue.js site.

Design

Game will contain separated by aspects systems.

Stack

Chosen stack grows up from requiremenets.

Web environment: Next.js, React.

Engine core: ECSY, PixiJS, Planck.js.

ECSY is an highly experimental Entity Component System for the web by Mozilla Mixed Reality team. It is pretty small (7.4KB minzipped) and aimed to good performance. It has fancy Chrome plugin as a devtool..

ECSY is the core of a game. It can be used with any rendering, physics, sound, input or any other systems communicating with external systems.

PixiJS is fast, flexible and free 2D engine for Web.

Planck.js is 2D JavaScript physics engine for Web development.