非同期的 (async) life game (JavaScript) - c4se記：さっちゃんですよ☆

昨日は同期的なlife gameをやった。
cf. JavaScriptで同期的life game http://c4se.hatenablog.com/entry/2013/09/27/033302
非同期版も実装した。まったく挙動が違ふ。
同期版は、わたしは大域的と呼んでゐて、世代の概念を持つ。或る世代の世界から次の世代の世界へは、線形の順序で関係付けられる丈で、初等的である。おそらく世界の決まり方が大域的である為に、大域的なpatternはなかなか見付けることができない。
非同期版では決まり方はそれぞれのcellが局所的に決定してゐる。同期版で見られるpatternは、周期1 (変化無し) のものは此ちらでも見られるが、周期2以上のpatternは見付けられない。非同期版ではcellの群は全体に広がって、迷路様のpatternを作る。此の迷路様のpatternは、同期版に於いてcellを生き残り易くした場合にも、似たものが現れるが、patternの特徴は異なる様に見える。此所では世界の状態間の関係は、線形な順序と考へるには高度な工夫がゐる様に思へる。一直線なgraphだとは考へない方が簡単そうだと直感はしておく。
生き残り方や死に方生まれ方のalgorithmは、Cell.prototype.next()を編集すれば実験出来る。
次には、背景場に起伏を持たせたり、複数種のcellを持つlife gameに興味が有る。

全く高速化の工夫をしてゐないので、非同期版はFirefox 23やIE 10では重過ぎる。描画はrequestAnimationFrameなので大したことは無いが、四万個のcellがそれぞれ思い思いにsetTimeoutを呼んでるから、四万個のtimerが管理されてゐる。重い。それでもV8だとそれなりに動く。

因みにlife gameに就いて色々知りたければ、此ちら。
cf. ライフゲームの世界 - 人工知能に関する断創録 http://aidiary.hatenablog.com/entry/20130105/1357353184

demo

It may be too heavy!

実装

普段では使へない最新のAPIをふんだんに使ってやった。でもOpera 16 (Chromium, V8), Firefox 23, IE 10で動く。ふんだんにとは言っても、Canvas API, querySelector(), requestAnimationFrame(), HTML5 template element, HTMLUnknownElement, CSS3 flexbox, defineProperty()位いしか使ってゐない。Canvas, querySelector, requestAnimationFrame, definePropertyは、もう「新しい」とは本当は言えない。普段だったら言わないが、網羅的と云ふ意味で取り敢えず挙げておく。
template要素はpolyfillを書いた。後は既に、全てのweb browserが対応してゐる。一部の残念なweb browser (残念な事に、全てのweb browserが、別々の箇所で残念である) では、vendor prefixを要する丈だった。
Life game, sync and async. https://gist.github.com/ne-sachirou/6730101
_20130928_1と云ふ変なsuffix (接尾辞) は付いてゐるのは、此のblogで他のscriptと共存させる為に過ぎない。
然ふ云へば、Gistのrawを其のままscript要素で読み込んでも、実行されなかった。御陰で上記demoではJSONPを使ふ羽目に成ってゐる。

<script>
  function loaded(json) {
    var js = json.data.files['lifegame.js'].content;

    eval(js);
  }
</script>
<script src="https://api.github.com/gists/6730101?callback=loaded"></script>