Flapjax を試す - zyxwvの日記

今更ながら Flapjax を試す。というかほんとに試しただけ。
Flapjax は FRP(Functional Reactive Programming) というものを JavaScript で実現したもの。FRP は、時間に応じて変化していくような値を Behavior という特別な値で表す。Behavior の値が変更されると、その値を使っている部分が自動で再計算される。これにより、イベントハンドラを記述する必要がなくなり、より宣言的にプログラムを記述することができるのだー。

まずはインストール

Flapjax (http://github.com/arjunguha/flapjax/tree/master)
haskell-web (http://github.com/arjunguha/haskell-web/tree/master)

Flapjax のインストールには WebServer というライブラリが必要だが、実は haskell-web という名前で公開されている。他の依存パッケージは cabal で大丈夫。

コンパイル

それぞれのディレクトリに入って make するだけで問題なくコンパイルできた。コンパイラは macports で入れた GHC 6.10.3。

HelloWorld 的なもの

公式のチュートリアル(http://www.flapjax-lang.org/tutorial/)がわかりやすくておもしろい。
以下蛇足。

<html>
  <head>
    <title>TEST</title>
    <script type="text/flapjax">
      var mousex = mouseLeftB(document);
      var mousey = mouseTopB(document);
    </script>
  </head>
  <body>
    <h1>{! timerB(10) !}</h1>
    <p>({! ((mousex > 1000) ? constantB("over 1000") : mousex) !}
      ,{! ((mousey > 500) ? constantB("over 500") : mousey) !})</p>
  </body>
</html>

このような内容を持った test.fx というファイルを Flapjax のコンパイラ fxc でコンパイルすると、JavaScript のコードが出力される。

Flapjax では "B" で終わるメソッドが Behavior である。timerB は現在の時刻を、mouseLeftB と mouseTopB はそれぞれマウスのx,y座標を値として持っている。constantB は常に引数で与えられた値を持つ Behavior である。

マウスが動いたというイベントが発生したら特定のタグ内の値を書き換える、というイベントハンドラを書くよりも宣言的でわかりやすい。