Sunday, September 18, 2011

0x0001 Dev Diaries - Entities, Events, Rendering

I've been tinkering on a small Javascript and Canvas engine for the last few weeks, and I'm mostly happy with the results, if not as happy with the progress. Still, it has been steady, so I'll focus on being happy for that part.

I'm starting to split the codebase into two parts: a javascript utility library, very similar to backbone.js, and the game engine on top of it.

At the core is an event and entity system. The entities are component based, and access named components via get() and set() methods, which is not great but allows for nice behavior by triggering events on property set, allowing other code to subscribe to changes on entities. For example, the render binds to the "setposition" event and will mark any entity for re-rendering when it has moved.

Entities don't get any logic or behavior. Separately, Behavior types are defined and serve two purposes. Firstly, they get a tick() method called, given a time delta since the last call, and are allowed to do any updating to the entity states. This is where I'm integrating Box2Djs, for example. Secondly, behaviors can subscribe to any events in entities they are applied on, so a Draggable behavior watching an object has an "" event fired when any of its entities "" event triggers, allowing the behavior to response in whatever way is appropriate.

I am also happy to have, so far, kept the rendering component completely isolated. When I get around to writing a WebGL renderer, it should be able to do so without any changes to entities, behaviors, or anything else.

I'll be posting up a version of both the core JS library and the engine some time this week.


  1. Is the source for this available somewhere? I'd be interested to see it.

  2. You mentioned Backbone.js, so I'm wondering whether you have tried the combination of Backbone.js and Canvas? I'm trying to separate each Backbone.View to a part of the canvas so that I can bind events on it, but failed to do so.

    Regarding the Component-Based Entity system you are building, do you think Backbone.js can be used to construct it? It has event system, its View (and even Collection) can be considered a component for the Model. You bind model's state with events, and view (and collection) will change accordingly.

    It's just my 2c. I'm still researching on all of them (Canvas, Backbone.js, Component-Based entity system). It's nice to have somebody else working on it also.