#11 Entity Component System architecture - from my forthcoming article on medium

uml image

Diagram Information

Created by: abulka   published
Language: Python
Repository: abulka/wx_esper
Commit: master

Description:

This is the architecture referred to in my forthcoming article.  Here is a sample:

Building traditional GUIs with the Entity Component System

Is the Entity Component System any good for building traditional GUIs?

Continuation of my Gui Showdown — ECS vs Plain Javscript vs. MVC vs. Vue.js

The ECS (Entity Component System) architecture is the new hotness in game developer circles. Its a way of architecting your software that rejects classes in favour of a more deconstructed, data driven approach. The results, in gaming apps at least, are massive reductions in complexity and huge increases in performance and maintainability.

When I read about ECS it got me thinking — why not use it for more traditional software, not just games? 

So I went about building a small, simple, traditional form based application in Javascript using ECS. I ended up implementing it in four different ways! 

  • A simple, ad-hoc, plainjavascript/JQuery implementation
  • An Object Oriented, MVC(Model View Controller) implementation utilising the Observer design pattern
  • An ECS(Entity Component System) implementation 
  • Vue.jsimplementation

My earlier article Implementing Object Oriented MVC in Javascript vs. Vue.jsdeals with the plain Javascript vs. MVC and Vue.js implementations. It might be worth reading before continuing.

I built the various implementations in both Javascript and Python

I built the various implementations in both Javascript and Python — so that you can chose which language you are more familiar with. The main article uses Javascript and the DOM for its discussion and examples, however the Python implementation has a section at the bottom of the article.

Chasing MVC

In a way, all GUI apps want to do the same thing: display information, allow users to manipulate that information, run business logic to add value — then display the results. The Model View Controller (MVC) architectural design pattern, invented in the late 1970’s, whilst understood in different ways, basically asks us to separate the Model (the information) and View (the GUI presentation) — with the Controller role looking after handling GUI inputs and business logic.

The pure Javascript implementation has the controllers (the DOM event handler functions) doing everything in a fairly ad-hoc way. The Object Oriented, Observer pattern based implementation creates mediator objects that do most of the controller functionality in a more organised way.

The Entity Component System (ECS) implementation deconstructs MVC and deconstructs Object Oriented programming itself, to do things in a totally mind altering way

The Entity Component System (ECS) implementation deconstructs MVC and deconstructs Object Oriented programming itself, to do things in a totally mind altering way. By understanding the MVC roles, we can hopefully track where all the roles went!

Please contact me for the full text of this article, if you are interested.

 

Modules being visualised

List of repository modules/files being visualised in the above diagram: