Dampening, Buffering, OpenSearch, Ajax な Hack

ちょっと前に Six Apart の Anil Dash の blog で Web Development Trends for 2006 なんて話題があって、来年のウェブ開発トレンドはこれだ! なんてことを彼の独断でリストアップしてました。氏曰く AtomPP, XHTML, JSON, E4X, Ruby ... などなど。

このリストがほんとにトレンドになるかですが、Ruby は Rails の勢いがますます加速しているし、AtomPP は今年末に仕様が確定する他 RESTful なアプリケーション設計が注目を集めています。あと JSON が熱いのはいわずもがな...ということで結構いいところを突いてる気がします。

この中で聞きなれないれない言葉として Dampening と Buffering というのが出てきます。どちらも Rails を開発した DHH がいる 37signals のアプリケーションでよく使われている技法、というか JavaScript による UI エフェクトで、Dampening は、変更箇所を黄色くフェードアウトさせるエフェクトで目立たせるYellow Fade Technique、Buffering はローディング中を示すインジケーターアイコンを表示したりするテクニックなんかがその具体例。で、この Dampening と Buffering は Ajax と組み合わせて使うと愛称が良い。

そんなわけで、Google Blog Search もオープンしたことだし、ちょっと Hack してみました。

• Dampening, Buffering, OpenSearch, Ajax

検索するとローディングアイコンがでて、検索結果のナビゲーションに Yellow Fade Technique によるエフェクトがかかります。

使ってる JavaScript ライブラリはお決まりの prototype.js と The Fade Anything Technique で公開されていた fat.js。fat.js は 37signals の Yellow Fade Technique をもう少し汎用化したスクリプトです。

ほんとはDBアプリケーションで、更新のあった箇所にエフェクトをかけるのが定番なんですが、このサーチのプログラムは DB を使ってないので、なんとなく適当なところにかけてみました。

Dampening と Buffering のテストだけじゃ面白くないので、昨日オープンしたGoogle Blog Search の RSS フィードを OpenSearch に対応させるよう Hack するアプリケーションも作って、はてな検索や Bulkfeeds と切り替えられる、それを Ajax で検索、ってなものにしてみた。(ページャーが出なかったり日本語で検索すると化けたりしますがその辺はご愛嬌、作りこむのがめんどくさいので...。)

ということで

• Dampening (fat.js)
• Buffering
• Google Blog Search
• OpenSearch
• Ajax (prototype.js)

な Hack となりました。

ソースはこのへん。