2009-01-07 147 views

回答

19

你並不需要一個。右鍵單擊頁面,選擇View Page Info,大小已列出。

Page Size http://www.shog9.com/pageSize.png

+6

注意:這是純HTML的大小(單獨的圖像,JS,CSS不算)。請參閱下面的其他選項。 – Nickolay 2010-01-10 19:24:09

+1

@Nickolay:正確。如果你想優化整個包(包括AJAX加載的內容),我推薦Firebug(參見nshaw的回答) – Shog9 2010-01-10 21:17:20

5

Firebug如果你想要一個深入的分析。如果你只是想要最後的數字,請右鍵單擊並選擇「查看頁面信息」。

2

FireBug允許您查看頁面大小和所有aditional下載(css文件,圖像等)的大小。它也可以讓你做各種酷調試的事情。

2

FireFox View頁面是HTML的大小。 WebDeveloper添加打破了嵌入在頁面中的其他請求,例如CSS,圖像,javascripts等。

12

如果您正在優化頁面大小(以千字節爲單位,而不是像素!),您需要知道每個元素的壓縮大小,如果你的服務器正在壓縮你的輸出。您無法通過標準網絡瀏覽器獲得該功能「右鍵單擊 - >屬性」。

在另一個回覆中提到的Web開發人員工具欄擴展會執行此操作。

http://https//addons.mozilla.org/en-US/firefox/addon/60

我還沒有找到另一個工具,報告的壓縮和非壓縮尺寸每個頁面元素,從而方便。

安裝Web Developer Toolbar並轉至工具 - > Web Developer - >頁面信息 - >查看文檔大小。非常便利!

Scripts (7 files) 82 KB (243 KB uncompressed) 

- http://stackoverflow.com/Content/Js/jquery.package.master.js?d=20081101 39 KB (109 KB uncompressed) 
- http://stackoverflow.com/Content/Js/wmd-base.js 15 KB (59 KB uncompressed) 
- http://www.google-analytics.com/ga.js 9 KB (22 KB uncompressed) 
- http://stackoverflow.com/content/js/jquery.package.question.js?cachebreaker=20090107 8 KB (27 KB uncompressed) 
- http://stackoverflow.com/Content/Js/showdown.js 4 KB (10 KB uncompressed) 
- http://stackoverflow.com/Content/Js/jquery.package.editor.js?cachebreaker=20081008.1 3 KB (9 KB uncompressed) 
- http://stackoverflow.com/Content/Js/wmd-plus.js 3 KB (7 KB uncompressed) 

Style Sheets (3 files) 7 KB (27 KB uncompressed) 

- http://stackoverflow.com/Content/all.css?d=20081101 6 KB (26 KB uncompressed) 
- http://stackoverflow.com/Content/print.css 705 bytes (1 KB uncompressed) 

如果有更好的工具,我很樂意聽到它。這個功能是唯一讓我完全放棄Firebug的Web Developer Toolbar的東西。也許YSlow做到這一點;需要研究更多。

3

從右鍵菜單中內置的Inspect Element (Q)可以做到這一點。轉至Network選項卡,重裝看看吧:

enter image description here