Yahoo!は7月31日(米国時間)、The Yahoo User Interface Libraryの最新版となるThe Yahoo User Interface Library(以降、YUI)2.3.0を公開した。YUIはJavaScriptで開発されたWebページやWebアプリケーション向けのユーザインタフェース/デザインパターンライブラリ。実際にYahoo!で採用されているJavaScriptライブラリをまとめたもので、The BSD Licenseの下で配布されている。

YUI 2.3.0ではスキンアーキテクチャに対して6つの新機能が追加されているほか、UI制御に対する新しい仮想処理が追加されている。また250ちかい機能拡張とバグ修正も実施されていることから、2.2.0を使っている場合には状況に応じて2.3.0へのアップグレードを検討されたい。特に興味深い機能は次のとおり。

  • リッチテキストエディタの追加(β版)
  • Base CSSの導入
  • YUI Loaderユーティリティの追加(β版)
  • ImageLoaderユーティリティの追加(実験的提供)
  • カラーピッカーコントロールの追加(β版)
  • YUIテストユーティリティの追加(β版)

2.3.0で注目されるのは、従来の方法からスキンアプローチを使った方法へシフトしている点にある。従来までのバージョンでは実装レベルでのスタイル指定を尊重していたが、2.3.0からはプレゼンテーションをCSSへ分離するように方法論が変更されている。同アプローチによって従来よりもカスタマイズデザインの作成が簡単におこなえるようになっている。

またここ数カ月の取り組みで、一貫した操作性を提供するようにUIとコントローラに改善が加えられた点が評価できる。デフォルトで提供しているスキン(Samスキン)もこれまで提供してきたスキンのなかでもっともスタイリッシュであるとされており、同バージョンにかける意気込みが感じられる。

2.2.0がリリースされたときと同じく、2.3.0も以前のバージョンから多くの変更が実施されている。なんの変更もなしにそのままアップグレードするというわけにはいかないかもしれないが、2.2.0と比較して2.3.0は機能の面で魅力的だ。可能であれば移行を検討されたい。

リッチテキストエディタ(β版)の動作例

YUI Base CSSを使ったテキストの表示例

YUI Loaderユーティリティの動作例 - 同機能を使ってカレンダコンポーネントをロードしている

ImageLoaderユーティリティ動作例 - この場合画像の位置は固定でサイズ変更させるとブラウザがスクロールバーを出す

カラーピッカーコントロールの動作例

YUIテストユーティリティの動作例