ちょくちょくいじっていた hatebmap が、とりあえず一段落。

MochiKit

ライブラリには、ごくせまい範囲で流行っている気がする MochiKit を使ってみた。

MochiKit は面白いけど使いやすくはないような。ただ、この面白さと使いやすくなさはどちらも同じ「いままでは無い感じで新鮮だけど慣れない」というところから来ているようにも思うので、もうちょっと使ったら変わるかもしれない。

Graceful degradation

去年、バイト先のひとにおすすめされてちょっとだけ読んだ DOM Scripting という本があって "graceful degradation" はそれで知ったキーワード。ほかにも "progressive enhancement" とか "unobtrusive JavaScript" というのもあったけど、どれも基本的には同じ「CSS とか JavaScript とかは、無くても良いけどあったらより良い、という感じにしようね」というはなしだったと思う。

hatebmap の場合、矩形の位置と大きさの指定は HTML に style="..." と直書きして、矩形の面積に応じた文字サイズの変更だけ JavaScript にまわしていたんだけど、これだと JavaScript なしの環境で、文字サイズ変更無しにせまい矩形に配置されてしまったりで読みづらいので、矩形への配置も JavaScript でやるようにした。それにともなって、ウィンドウサイズの変更にも対応。

treemap の計算自体はサーバーサイドでやってるので、JavaScript はかけ算だけ。それでも一気にやると重いので Deferred ですこしづつ実行している。

ツールチップ

文字サイズがちいさいものは読みづらかったりするので、タイトルとユーザー数をツールチップで出してみた。

マウスを置いて数秒で表示するところも Deferred。MochiKit っぽく書けた！と思ったけどこれは setTimeout でも書けるな……。