Gaps in FireBug waterfall chart

Question

When testing performance of various web pages on my web application I noticed that there are some gaps in net tab (waterfall chart) in firebug. In some cases these may take up half of the time for the whole request.

What usually causes these gaps and how can they be removed?

Answer 1

The main reason this happens is for files that are loaded by scripts and CSS files.

• For example: CSS, background images won't start loading until a small delay after the CSS file that links to them loads.

• Many JS libraries also load images, CSS, and/or other files. These loads won't start until the calling JS is loaded, plus a small processing delay.

• Libraries, or inline JS, may also fire off loads at the DOMContentLoaded event (the purple line) or the load event (red line).

• Finally, obviously, JS can execute AJAX that fires after any manner of delays/intervals.

Answer 2

Jan Odvarko who worked on Firebug explains it himself here:

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

He mentions the gaps in comment #18:

"These gaps represent a time when no requests happened, this can be e.g. due to a javascript execution on the page, which blocks page download or page rendering, CSS resolving, etc."

Answer 3

The most obvious reason I can think of (other than a bug in Firebug) is that you've got the filter switched to only show a subset of requests. For example, you may only be showing Javascript files, etc.

Your screenshot doesn't include the filters or the filenames, so I can't tell that for sure, but that seems like the most obvious answer.

Immediately above the panel in your screenshot is a block of filters. Make sure you've got the "All" option selected. If you have anything else selected, then gaps are to be expected.

The other reason would be if you have some page elements being fetched separately from the initial load, eg via Ajax or deferred loading. These may be loaded very soon after the page has loaded, but not immediately, leading to gaps in your timeline.

Hope that helps.