FireBug瀑布圖中的空白

Question

在我的web應用程序上測試各種網頁的性能時，我注意到firebug中的net標籤（瀑布圖）中存在一些空白。在某些情況下，這些可能會佔用整個請求的一半時間。

什麼通常會導致這些差距，他們如何被刪除？

Answer 1

發生這種情況的主要原因是由腳本和CSS文件加載的文件。

• 例如：CSS，背景圖像不會開始加載，直到鏈接到它們的CSS文件加載後一小段延遲。

• 許多JS庫也加載圖像，CSS和/或其他文件。這些加載只有在調用JS被加載後纔會啓動，加上一個小的處理延遲。

• 庫或inline JS也可能在DOMContentLoaded事件（紫色線）或load事件（紅線）處觸發負載。

• 最後，很明顯，JS可以執行AJAX，在任何方式的延遲/間隔之後觸發。

Answer 2

最明顯的原因我能想到的（除了在Firebug的錯誤等）的是，你已經得到了過濾器切換到只顯示請求的一個子集。例如，您可能只會顯示Javascript文件等。

您的屏幕截圖不包含過濾器或文件名，所以我無法確定，但這似乎是最明顯的答案。

緊靠屏幕上方的面板是一塊過濾器。確保你已經選擇了「全部」選項。如果您還有其他選擇，那麼預計會出現差距。

另一個原因是，如果你有一些頁面元素與初始加載分開提取，例如通過Ajax或延遲加載。這些可能會在頁面加載後很快加載，但不會立即導致時間軸上的空白。

希望有所幫助。

Answer 3

月Odvarko誰在Firebug的工作解釋了它自己的位置：

http://www.softwareishard.com/blog/firebug/firebug-net-panel-timings/

他提到在評論＃18的差距：

「這些差距表現的時候沒有請求發生，這可能是由於頁面上執行了JavaScript，這會阻止頁面下載或頁面呈現，CSS解析等。「