Hyalite 2016

この記事はOpal Advent Calendar 2016の5日目の投稿として書いています。

今日はこのアドベントカレンダーですっかりおなじみになったHyaliteについて近況を報告しようと思います。
なんか自分のgemばかり紹介するアドベントカレンダーになってしまっていますが、他に書くひとがいないのでしょうがないですね。
明日のyharaさんの記事に期待しましょう。
Opalのいろいろなgemを紹介したりしたいのですが、台湾での発表の熱があるうちにこの辺りのことを書いておこうと思います。

ここまで書いて、旅行つかれにより寝落ちました。公開遅れてすいません。yharaさんの記事ももう公開されていますね (> <)

さてHyaliteのアップデートですが、とはいえそれほど大きなアップデートがあったわけではありません。

• force_updateメソッドが追加されました。38d4119f
• renderするだけのコンポーネントを簡単に書けるようになりました。610bf23f
• classやforといったプロパティはclassName,htmlForなどのようにキーワードと被らないような名前を使っていましたがそのままの名前でも使えるようになりました。0c4b0dd7
• Hyalite::Component::ShortHandにppメソッドを追加しました。(pメソッドは<p>タグを表すために使われているためKernel#pはシャドウされてしまっています。) cfc8b999
• initial_stateをstateでDSL的に宣言できるようなり、stateの参照方法もメソッドとして呼びだせるようになりました。4e02842e
• Hyalite::Component::ShortHandをincludeしなくてもよくなりました。cf6e9276,6f4e2266

記述方法が多少短かく書けるようになったとかそんな感じです。
結果、READMEに書かれていたサンプルは以下のように書けるようになりました。

require 'hyalite'
require 'browser/interval'

class ExampleView
  include Hyalite::Component

  state :count, 0

  def component_did_mount
    every(5) do
      @state.count += 1
    end
  end

  def render
    div({class: 'example'},
      h2(nil, @props[:title]),
      h3(nil, "count = #{@state.count}")
    )
  end
end

$document.ready do
  Hyalite.render(Hyalite.create_element(ExampleView, {title: "Hyalite counter example"}), $document['.container'])
end