『続・ハイパフォーマンスWebサイト』イベントに参加しました

こんにちは。Yahoo!検索の高林です。先日、書籍『続・ハイパフォーマンスWebサイト』（オライリー刊）に寄稿させていただいた関係でトークイベントに参加してきました。
お忙しいところ、たくさんの方々に出席していただき、ありがとうございます。

今回のイベントでは、「Yahoo!検索のパフォーマンス向上策全て見せます！」というテーマでYahoo!検索で実際に行っているTipsの紹介と現在、Yahoo!検索で検討しているシステム構成などを発表しました。
そのときの発表内容は、以下のリンクから確認できますのでご興味のある方はご覧ください。
『続・ハイパフォーマンスWebサイト』出版記念トークイベントのビデオを公開 (O'Reilly Japan)

トークセッションでは来場者の方々にたくさんの質問をいただきました。今回はそのなかからいくつかピックアップしてご紹介したいと思います。

――Q: Yahoo!検索では、CSSを外部ファイル化とインライン化（HTMLに直接記述）する2つの手法を併用してるとのことですが、CSSやJavaScriptのインライン化と外部ファイル化する切り分けの基準などありますか？

A：Yahoo!検索では、常に適用されるCSSファイルに関しては、インライン化、特定の条件（ダイレクトディスプレイ等）のみ適用されるCSSに関しては、外部ファイル化して管理しておりましたが、現在は、全てインライン化する形で運用されております。 JavaScriptファイルに関してましては、常に利用されるJavaScriptファイルに関しては、インライン化、特定の条件 (検索プラグイン等) のみで利用されるJavaScriptファイルに関しては、外部ファイルで運用する方法をとっております。

――Q: なぜYahoo!では、Webサーバの言語として、PHPを採用しているのですか？

A：Yahoo! JAPANでは、Yahoo!独自で利用しているライブラリ（extension）が豊富で扱いやすい などの点からPHPを主に利用しております。

――Q: 仮想化などを検討したりしないのでしょうか？

A：サーバリソースの使用率が低い場合は、仮想化に関しても1つの選択肢かもしれませんが、Yahoo!検索の場合は、サーバリソースの使用率が高いので、現段階では、検討しておりません。

――Q: Yahoo!検索では、データベースは何を利用していますか？

A：テックブログの記事「これがABYSSのすべてだ!!」でも紹介させていただいている高速、高精度な日本語全文検索エンジンや、Yahoo! Incで開発し、全世界のYahoo!で利用されている、独自の検索エンジンを利用しております。

――Q: CSSスプライトは、複数の画像を1つにまとめて転送量を削減するメリットがあると同時に運用上のデメリットなどもあるかと思いますが、通常画像とスプライト画像を切り分けする基準などはありますか。

A：弊社のデザイナーに確認した所、以下のような形で切り分けを行っているようです。 ◆imgのまま ・画像であることに意味があるもの。 ・また運用上スプライト画像としてつなげて利用できない物。 例↓） ・QRコード ⇒画像であること自体に意味があるため ・頻繁にさしかわるキャッチ画像 ⇒運用負荷を考慮するため ・一度に読み込む必要がないもの（天気アイコンなど） ⇒晴れ画像と曇り画像を一度に読み込む必要はないため) ◆スプライトにするもの ・リクエスト数が多い物 ・滅多に変更されない箇所 例↓） ・アイコンや骨組みに使う画像 ⇒滅多に変更されないので、まとめておいても運用負荷は少ない ・長期表示される複数のバナーなど ⇒変更があまりなければ、リクエスト数を軽減できるため なお、ページのあり方や方針によっては、この基準と違う場合もあるとのことです。

――Q: Yahoo!検索では、Webサイトの高速化を行うにあたって、どのような測定ツールを利用していますか。

A：Yahoo!検索では、様々なツールを利用して多角的に検証を行っています。ここでは、利用しているツールの一部をご紹介します。 firebug もはや、説明不要のWebデベロッパー必須ツール。デバッガやプロファイラ、HTTPチャートなどの機能を提供してます。 yslow 『続・ハイパフォーマンスWebサイト』の著者でもある、Steve Souders氏が開発したWebページのパフォーマンスを計測してくれるツールです。 httpwatch IE,Firefoxで利用できる、ネットワークのトラフィックをグラフィカルに表示してくれるパケットアナライザです。 IBM Page Detailer Basic httpwatchと同じくパケットアナライザです。httpwatchで対応していないOperaやsarafiなどのウェブブラウザを分析する際に利用しております。 YUI Compressor JavaScriptやCSSファイルを圧縮してくれるツールです。 Fiddler パケットの監視やブレークポイントの設定、トラフィックの内容をグラフィカルに表示してくれます。

今後も、Yahoo!検索をよろしくお願いします。