Firebugと合わせて使いたいパフォーマンス分析ツール「YSlow」

杉山貴章（オングス）
2008-11-14 17:00:00
  • このエントリーをはてなブックマークに追加

YSlowでウェブサイトのパフォーマンスを検証

　YSlowはYahoo! Developer Networkを通じて提供されている拡張で、ウェブページのパフォーマンスを計測し、13の項目について項目別の評価結果を表示する。そしてパフォーマンスの悪い部分については、考えられる原因や改善のためのヒントなどを示してくれる。

　FirefoxにYSlowをインストールするには、先にFirebugがインストールされている必要がある。YSlowが有効になっていると、Firebugに図1のようにYSlow用のパネルが追加される。またステータスバーにはページの表示速度や構成しているファイルのトータルサイズなどが簡易表示される。

図1 YSlowをインストールするとFirebugにパネルが追加される 図1 YSlowをインストールするとFirebugにパネルが追加される

　YSlowパネルのメニューから[Performans]をクリックすると、そのページの表示パフォーマンスを計測し、図2のように13の項目について評価結果を表示する。評価はAからFの6段階で、Aが最良である。

図2 13項目について、6段階の評価を表示 図2 13項目について、6段階の評価を表示

　[Stats]ボタンをクリックすると、図3のようにキャッシュが存在する場合としない場合の転送量やHTTPリクエスト数が表示される。また、[Components]ボタンでは各コンポーネントごとのサイズやレスポンス時間などの情報が一覧表示される。

図3 コンポーネントのキャッシュ状況を表示 図3 コンポーネントのキャッシュ状況を表示

　その他、[Tools]メニューからはJSLintを使ったJavaScriptの構文チェックや、全てのJavaScriptまたはCSSファイルを1つのファイルにまとめて表示する機能、評価結果をHTMLのページとして表示する機能などが利用できる。次回は、評価結果の各項目の示す意味については紹介したい。

  • 新着記事
  • 特集
  • ブログ
このサイトでは、利用状況の把握や広告配信などのために、Cookieなどを使用してアクセスデータを取得・利用しています。 これ以降ページを遷移した場合、Cookieなどの設定や使用に同意したことになります。
Cookieなどの設定や使用の詳細、オプトアウトについては詳細をご覧ください。
[ 閉じる ]