blog
discuss
contribute
documentation

Network Monitoring

Some of your web pages are taking a long time to load, but why? Did you go crazy and write too much JavaScript? Did you forget to compress your images? Are your advertising partner's servers taking a little siesta? Firebug breaks it all down for you file-by-file.

Watch the timeline unfold

Each file in the Net tab has a bar which shows you when the file started and stopped loading relative to all the other files. The bars will each you things you didn't even know. For instance, did you know that JavaScript files load one at time, never in parallel. This will help you tune the order of files in page so that the user spends less time waiting for things to show up.

Break it down by type

Sometimes you are particularly concerned about a certain type of file, like JavaScript or images. Click the buttons in the Net toolbar to filter the list by type. This is also a great way to find out the total size and download time for a particular type of file.

Cached or not cached

Not all network requests are equal - some of them are loaded from the browser cache instead of the network. Firebug color codes requests that are served from the cache in a lighter gray so you can quickly scan and see how effectively your site is using the cache to optimize page load times.

Examine HTTP Headers

HTTP headers contain all sorts of interesting information like the mime type of the file, the type of web server, caching directives, the cookie, and lots more. To see the HTTP headers, just click the arrow to the left of each request to expand it.

XMLHttpRequest monitoring

The phenomenon that is Ajax revolves around a little thing called XMLHttpRequest. It's not much fun to send these requests out and get no visual feedback about their travels. Firebug shows you each XMLHttpRequest, both in the Net tab and the Console tab, along with the text that was posted and the text of the response.