画像結合/CSS切出で転送量&HTTPリクエスト削減 - CSS Sprite Generator 2

Ed Eliot氏およびStuart Colville氏は23日(米国時間)、CSS Sprite Generatorの最新版となるCSS Sprite Generator 2を公開した。CSS Sprite Generator 2はオーバーホールが実施されたメジャーアップグレードバージョン。以前のバージョンでは画像の結合にGDを採用していたが、新しいバージョンではImageMagicが採用されている。この変更で従来のバージョンよりも高品質な画像が生成されるようになったほか、発見されていたバグが修正されている。

またCSS Sprite Generator 2では追加機能として、PNGまたはGIF画像で利用する色数を指定できるようになったほか、JPEGに対する画動品質が指定できるようになっている。またPNGを使っている場合に出力を圧縮する目的でOptiPNGを選択できるように機能が拡張されている。OptiPNGのサポートで少なくとも50%はサイズが縮小されると報告されている。

CSS Sprite Generatorは画像をひとつにまとめることで画像要求のコネクション数を削減しようという取り組みのためのツール。画像をZIPでまとめてアップすると、画像の結合を実施し、結合した画像と、その結合した画像からデータを切り出して使うためのCSSが生成される仕組みになっている。実際に計測してみても転送量の削減とHTTPリクエストの減少が確認できる。Webサイトのパフォーマンスを向上させるうえで効果的な取り組みだ。

CSS Sprite Generator 2のソースコードはまだ公開されていないが、コードは完全に再構築され理解しやすいようにコメントがしっかりつけられているという。以前のバージョンがLaunchpadで公開されたように、CSS Sprite Generator 2も数日後にはLaunchpadのページで公開されるとされている。前回の公開と同じであればThe BSD Licenseのもとで提供されることになるだろう。

Ed Eliot氏およびStuart Colville氏はリリースアナウンスのなかで、今のところサイトの翻訳が欠落していることから、手伝ってくれるユーザは申し出て欲しいとしている。特に日本語、ロシア語、オランダ語、ポーランド語、トルコ語、韓国語、ルーマニア語の翻訳手伝いを応募している。関心があるユーザはWebsite Performance - Your Languageのページを参照してみてほしい。