Cellular Automata

18 Sep 2012

I have to say that I’m absolutely in love with Less and Clojure right now. When I built reidmckenzie.com the first time I used PHP and hand-formatted the HTML using style= values that I typed by hand or more bizarrely generated with a Python script which approximated the functionality of a Markdown processor. But hey, I was a sophomore in high school and I didn’t know any better.

This summer when I began deploying to reidmckenzie.com was my first real venture down the rabbit-hole of CSS and Javascript let alone the fact that I was writing my page generators in Clojure under a month after I began to use the language at work. That second round was awesome, because I got a taste of how easy CSS makes the formatting if done right. Unfortunately I was still doing it by hand.

Now I’m on my third real release of my personal website and I have to say I’ve come a long way. Black and green became grey and green, and finally white with grey touches. Anyway, onto the main attraction: My new lack of a logo!

I was never really happy with the .gif of a Game of Life glider. It just felt cheap, in no small part because I had pulled it straight off of the Wikipedia page. Besides, Conway’s Game of Life is dead easy to code up, and any programmer worth his salt should be able to cook up a working version so I felt that I was almost honor-bound to replace my cruddy borrowed .gif with a “real” animation achieved through “real” code. And here it is, the real deal.

JavaScript lets you do all kinds of amazing things, and Clojure thanks the the ClojureScript compiler can be built for the web. As a result, my initial hope was to keep my codebase “pure” Clojure by throwing the animation together in ClojureScript and deploying it as part of the website to be rendered by the client. Unfortunately, I hit a series of snags with making ClojureScript work for me and to be honest I was in untried territory. So I tossed in the hat on ClJS for the time being and went back to my tried-and-true Clojure, CSS and JQuery guns.

The glider gun you see below this article is in fact the url reidmckenzie.com/blog/gol, which is recalculated according the the Game of Life rules on a five-second clock tick by a dedicated thread. This thread updates a Clojure Atom (a piece of software-transactional memory) which serves as a render cache for that page until it is recalculated in five seconds time.

Meanwhile, everyone viewing this page has a JQuery refresh function set on a five-second callback which will fetch the new page at some time T before the server calculates the next frame. Unfortunately, this means that I’m pushing text equal to about 75% of this front page (without the animation that is) every five seconds to every person viewing this website. As you can imagine, that adds up quickly.

However, it’s good enough for now. The effort which it took me to construct this system using the tools with which I am familiar was negligible compared to the time it would have taken me to teach myself JavaScript. That said, I will soon be phasing out this server-side version for a trivial and equivalent client implementation when I have time to do so. However, homework calls and this site looks pretty sharp if I do say so myself.

Bedtime.