Firebug」がリリースされました。Firebugをインストールしている上で、YSlowをインストールすると、Webサイトの高速化を行うためのポイントと、現状についてのポイント表示を行ってくれます。これ、実際に試してみるとよく分かるのですが、いかに工夫をしていないサイトは、改善の余地があり余っているか。ほんと身を引き締められます。ちなみにYSlowでは次の項目をポイントに挙げています。Guideより抜粋これらの観点から、総合的なポイントを算出してくれます。良いのがAランクで、最も悪いのがFランク。自分のサイトはどうだろう?と、いうわけで直近で仕事で作っていたサイトを計測してみると「F」でした。ちなみにGoogle.comは「A」、Yahoo.comで「B」、Yahoo.co.jpで「C」でした。Yahooも国内外でランクが違うのはなかなか興味深いです。CSS+JavaScriptガリガリのサイトの場合、結構工夫していないと、すぐにランクは落ちてしまうと思います。みなさんも自サイトは要チェック!さて、仕事サイトが「F」だったのですが、「F」のままだとWeb屋としてちょっとシャクですし、手直ししてみたいと思います。自分の場合、各項目については、こんな結果でした。ETagsこれで総合で「F」です。うーん、悔しい!まずは各項目の中から、「F」である項目から対処していきたいと思います。Components」について、対応してみたいと思います。これは要するにHTTPのレスポンスを圧縮することで、レスポンスを速くしよう!という狙いです。2.2系統ならmod_deflateを利用することでレスポンスの圧縮が可能です。ちなみにApache2.2系からはmod_filterがどうも推奨されているようなのですが、まとまった情報が少なかったので、今回はmod_deflateを利用してみることにします。対応方法は非常に簡単。httpd.confについて次の項目を追記します。application/rdf+xml&lt;/Location&gt;Locationのところは各環境に合わせてください。ある階層のみに対応させる場合はDirectoryとかでもいいと思います。上記の前半は、圧縮についての全般的なルールです。圧縮を可能に、gzip圧縮を扱うことができない古いブラウザからのリクエストについては、圧縮したレスポンスを返さない、画像ファイルについては圧縮しても無意味(すでに圧縮されているデータ)なので圧縮しない、などの設定になります。後半は、圧縮対象のファイルをMIMEタイプによって指定しています。上記では全部バラして書きましたが、少し冗長なのでこんな書き方でもOKです。application/x-javascript...さて、これでhttpdを再起動させて、実際に圧縮できているかどうか確認します。components」の箇所を確認するのもいいですし、もっと細かな圧縮量が知りたい場合は、このサイトから確認することも可能です。調べ方はとても簡単で、調査対象URLを入れて「go」を押すだけでOK。gzipされたレスポンスを返した場合は、「圧縮後/圧縮前」のそれぞれのサイズを算出してくれます。bytesというわけで72.0%も圧縮されました!!(ちょっと予想以上の圧縮に笑ったw)また、YSlowの評価もgzipの項目が「F」から一気に「A」になりました。あわせて総合ランクも「F」から「D」に上がりました!と、いうわけで、ほんの少し手を入れてあげるだけでグーンと効果があるので、mod_deflateをまだ試していないWeb屋さんは、ぜひ検討をば。圧縮についてはCPUを食うので、現状でWebサーバのCPUリソースを結構消費している場合は要検討ですよ。あわせてチェックしておきたいこととして、mod_deflateは圧縮アルゴリズムに少しクセがあるようです。最初上記の設定ではHTMLファイルの圧縮についてはすんなりいったのですが、JavaScript、CSSファイルのレスポンスは全く圧縮されませんでした。CSSファイルが頑張れるはず!」と、いうわけでgzipの項目は「D」ランクでした。)ところが、特に設定を変えることなく何回かアクセスを行っていると、これらのファイルも圧縮されるようになりました。このあたりはCTOとも話していたのですが、どうもこんな仮説が浮かびました。「リクエストが多い、一定以上のファイルが圧縮対象になる??」うーん、、まだまだ謎です。時間があったらmod_deflateのソースを呼んでみたいなぁ、、とも思っていますが、この辺りの項目については、今のところ未確認です。したら僕の設定ミスがあったのかもしれませんが、上記項目について、もしご存知の方がいらしたら、教えていただければと思います。14:00今回のエントリーに関してはこれらの記事を参考にさせていただきました。netoworkより翻訳)参考にさせていただいたサイトの方々、どうもありがとうございました。dont-varyだと、早く圧縮された、との報告もありました。この方法を試してみるのも手かもしれません。07:16なかなかいいツールだというウワサのYSlowですが、使ったことがなかった。(そういうツールって多いですが。07:00フロントエンドのパフォーマンスチューニングで、やっぱり気になるのが、gzip圧縮をして転送量を減らすこと。>YSlow対策でmod_deflateを利用してHTTPレスポンスをgzip圧縮AboutこのBlogはクックパッドに勤めるWebエンジニアがLLネタや情報技術について直感で思ったことを何も考えず発信するサイトです。コメントやお問い合わせ、執筆依頼などは@ryo_katsuma宛のmention、またはメールなどでお待ちしています。