The “game” is a zero-player game, meaning that its evolution is determined by its initial configuration and does not require any other input. The “game” is based in a grid with cells. Each cell has only 2 states: alive and dead. There are only 4 rules that determines how the game evolves:

Any live cell with fewer than two live neighbours dies, as if caused by under-population.

Any live cell with two or three live neighbours lives on to the next generation.

Any live cell with more than three live neighbours dies, as if by overcrowding.

Any dead cell with exactly three live neighbours becomes a live cell, as if by reproduction.

One of the most interesting design patterns used on web development is the Publish/Subscribe. This pattern, also known as Pub/Sub, fits like a glove on the browser, mainly because the DOM is event driven, it uses events as its main interaction with API scripts. However, events aren not restricted to the DOM and you can have your own events on your API.

Pub/Sub offers a way to handle communication between various parts of a whole system. In short, subscribers want to be notified when something interesting happens and publishers want to notify, to those interested, that something has happened.

Pub/Sub diagram

So this is the idea, a client 1 say for instance “I want to be notified when the data changes” and client 2 says “The data has changed!”.
Now that client 1 has been notified, he can update the data on the page for instance.

Without Pub/Sub, this works as well, the main difference is that the publisher needs to know about the other clients. In this case, after data changes, client 2 needs to call directly client 1, which would sound like “Hi client 1, data has changed!”.
This means client 1 and client 2 are tightly connected. This scenario starts to be complex with the number of clients growing, making the maintenance of your code too dificult. And what if one client is not there or is not right implemented? Will the other clients be afected?

What Pub/Sub introduces is loose coupling, the publisher doesn’t need to know who are the clients or how many are they. Neither the subscribers need to know about publishers or other subscribers. If one fails the other ones will keep working normaly.

On the other hand this decoupling also presents as its disadvantage, mainly because the publisher and subscribers don’t have any guarantee that everything is working, there is no guarantee that subscribers will be notified neither publishers have the guarantee that anyone is listening.

Event though I think the advantages are much more valuable than the disadvantage, however, the Pub/Sub pattern doesn’t apply to every application, and there are situations more suitable than others.

For instance, this pattern is commonly used on MVC applications (or some variation), where the View subscribes to changes on the models, and react properly when the Model notifies about its changes.

Normaly Javascript frameworks and libraries, and not necessarly MVC frameworks, implement this pattern and lets you use it out of the box, for instance, if you are using jQuery you can use Custom Events.

However, I want to show how easy is to implement your own version of Pub/Sub so that you understand even better what happens.

Below you can see my tiny implementation and I hope the code and comments will be self explanatory.

And now, a short example of how this can be used. We have a list of items that we can add to the basket and we have two different vies of the basket, a simple one that shows only the total items and a detailed one where shows the items and quantities. When an item is added to the basket, the views will be notified and will refresh the data.

If you’ve been following my blog, you know that I’ve started with game development a few months ago.

I started with Javascript engines but, this time I tried something different. I started with Unity engine!

Unity 4.3 was launched with a new feature.. the 2D! So, I gave it a shot and I loved it! You really feel that you are working with a professional tool for developing games. I’ve started developing another clone of Flappy Bird that you can play here.

In this function, first we get some properties, the Y position of the image (set to 0 initially), the speed of the animation and the canvas size. Next I use the setInterval function to create the animation loop (which is not the best way, but for our demo it works just fine). In the loop, first we draw the bottom and then the remaining part. Finally we reset the Y if we reached the bottom of the canvas.

Oops, too fast? Ok, let just take a look at the drawImage. We are using all the parameters that the function provide to us.