0

This thread does a great job at detailing the process of connecting to a web page and displaying it in the browser.

But what I want to know is how can I track that process? Does Firefox or another browser have an option to log the process?

To put the question in context, I'm troubleshooting a slow website and when I click a link it says "Waiting for example.com..." This only happens when I do something in my WordPress installation and not when I try to load a static image, so there's SOMETHING in the WordPress ecosystem that's causing it to hang up. But "Waiting for example.com" is a really vague message, so it doesn't really give me anything to troubleshoot. I'd love to have a log where the browser is like "made a request to ...completed in 52ms. made a request to , timed out (20s)".

Does something like that exist? I usually search for these things but I wasn't sure what terms to use.

3
  • Note that there is also a QA site specifically for Wordpress. Mar 7, 2013 at 14:56
  • @JulianKnight I'm registered there as well; I figured a question about HTTP connections wasn't WordPress-specific enough.
    – Brendan
    Mar 7, 2013 at 15:22
  • 1
    It can be a tricky call certainly ;) Mar 7, 2013 at 20:52

5 Answers 5

1

Google Chrome has built in Developer Tools that can help identify issues. There is a "network" tab that can help identify what resources are being accessed and for how long.

3
  • Oh, cool! I see Firebug has a similar feature, now that I'm looking for it. Thanks! I think I'm going to need server logs to troubleshoot better, though...I'm trying to figure out if the problem is with the database but I don't think my browser is going to be able to tell me that.
    – Brendan
    Mar 6, 2013 at 18:25
  • IE's developer tools also has this. :) Mar 6, 2013 at 20:09
  • @techie007 - I realize that IE and Firefox (via Firebug) have similar tools. I personally prefer Chrome and so that is what I suggested.
    – Mike Chess
    Mar 6, 2013 at 21:28
1

Check out Fiddler:

Fiddler is a Web Debugging Proxy which logs all HTTP(S) traffic between your computer and the Internet. Fiddler allows you to inspect traffic, set breakpoints, and "fiddle" with incoming or outgoing data.

And Wireshark:

Wireshark® is a network protocol analyzer. It lets you capture and interactively browse the traffic running on a computer network.

Related:

1

If you like using Chrome, it has some extremely powerful built-in developer tools, that can be accessed via the shortcut Shift+Ctrl+I. Go to the network tab, and you can see all the HTTP requests and responses made by the page over the course of time, including AJAX requests, and get detailed information on each request. Using wireshark would provide similar results; however, since the Chrome tool are used specifically for debugging website issues, the presentation is done in a much more readable way.

1

Their is also microsoft's network monitor to add to techie007's list: http://www.microsoft.com/en-us/download/details.aspx?id=4865

It works similar to wireshark and I use them both when I need to. I agree with technie007's selection though but was offering up another answer.

You need to set the filter to what you want to in wireshark or network monitor to filter only specific traffic you want its not rocket science.

For example, the below will give you the packets received coming from/going to your server in wireshark just insert your ip address of the server after the equals part: ip.addr == ipaddressofserverhere

Edit: meant to add the part for only returning port 80 traffic for HTTP but could remember off my head what the filter was for it.

1
  • Note: This is now renamed to network analyzer from my research.
    – jeffery
    Jun 4, 2015 at 21:30
1

Most of the browsers now have excellent "Developer Tools" that will do all of this and more.

In addition, for Firefox, Firebug is a superb tool for analysing web connectivity and performance issues and has many plugins that add additional capabilities. There are also "lite" versions for other browsers.

Not the answer you're looking for? Browse other questions tagged .