mabots' blog

知のレバレッジを最大化せよ (旧はてなダイアリーから移転しました。)

Chromeの「Developer Tool」の「Resources」的な機能をFirefoxで実現する「YSlow」

携帯サイトを表示するとパケット代がいくらかかるのだろう、、等の疑問に答えるために開いたページでどのような(外部の)画像やJSが呼び出されて、結果的にページを表示するのにどれくらいのサイズのデータを読み込んでいるのか計算・比較したい場合があります。

Chromeでは、Developer Toolから「Resource」にアクセスして、「Size」を指定すれば、当該ページでどれくらいのトラヒックが生まれるのか計測できます。

同様のことをFirefoxで実施するには「YSlow」が便利です。firebugの一部の機能として機能します。(Firebugのタブの一つになる)

https://addons.mozilla.org/ja/firefox/addon/5369
http://developer.yahoo.com/yslow/

YSlow analyzes web pages and suggests ways to improve their performance based on a set of rules for high performance web pages. YSlow is a Firefox add-on integrated with the Firebug web development tool. YSlow grades web page based on one of three predefined ruleset or a user-defined ruleset. It offers suggestions for improving the page's performance, summarizes the page's components, displays statistics about the page, and provides tools for performance analysis, including Smush.it™ and JSLint.

どうすれば高速化できるか細かくアドバイスも受けられます。