Wireshark vs Firebug vs Fiddler - pros and cons?

DebuggingWeb ApplicationsFirebugFiddlerWireshark

Debugging Problem Overview


Recently, I came across an issue where a CGI application is not responding. Symptom is Firefox displaying:

> Transferring data from localhost...

But the thing is I cannot see any traffic from Firebug's Net panel, and the browser just stays on the same stage forever.

I am thinking about the ways to debug this application but I cannot see the source code or any of its compiled Java/C++ components, therefore I reckon a HTTP network level of diagnostics is a good start.

I have little experience in Fiddler and Wireshark, just wondering will they get better feedback/statistics in the HTTP network level? I've heard Wireshark is advanced but could possibly introduce a large volume of traffic so system admins don't like it very much. At this time I think Firebug doesn't really show me enough information.

I need to collect information so that I can then forward to client as proof.

Debugging Solutions


Solution 1 - Debugging

Wireshark, Firebug, Fiddler all do similar things - capture network traffic.

  • Wireshark captures any kind of network packet. It can capture packet details below TCP/IP (HTTP is at the top). It does have filters to reduce the noise it captures.

  • Firebug tracks each request the browser page makes and captures the associated headers and the time taken for each stage of the request (DNS, receiving, sending, ...).

  • Fiddler works as an HTTP/HTTPS proxy. It captures every HTTP request the computer makes and records everything associated with it. It does allow things like converting post variables to a table form and editing/replaying requests. It doesn't, by default, capture localhost traffic in IE, see the FAQ for the workaround.

Solution 2 - Debugging

The benefit of WireShark is that it could possibly show you errors in levels below the HTTP protocol. Fiddler will show you errors in the HTTP protocol.

If you think the problem is somewhere in the HTTP request issued by the browser, or you are just looking for more information in regards to what the server is responding with, or how long it is taking to respond, Fiddler should do.

If you suspect something may be wrong in the TCP/IP protocol used by your browser and the server (or in other layers below that), go with WireShark.

Solution 3 - Debugging

None of the above, if you are on a Mac. Use Charles Proxy. It's the best network/request information collecter that I have ever come across. You can view and edit all outgoing requests, and see the responses from those requests in several forms, depending on the type of the response. It costs 50 dollars for a license, but you can download the trial version and see what you think.

If your on Windows, then I would just stay with Fiddler.

Solution 4 - Debugging

Fiddler is the winner every time when comparing to Charles.

The "customize rules" feature of fiddler is unparalleled in any http debugger. The ability to write code to manipulate http requests and responses on-the-fly is invaluable to me and the work I do in web development.

There are so many features to fiddler that charles just does not have, and likely won't ever have. Fiddler is light-years ahead.

Solution 5 - Debugging

I use both Charles Proxy and Fiddler for my HTTP/HTTPS level debugging.

Pros of Charles Proxy:

  1. Handles HTTPS better (you get a Charles Certificate which you'd put in 'Trusted Authorities' list)
  2. Has more features like Load/Save Session (esp. useful when debugging multiple pages), Mirror a website (useful in caching assets and hence faster debugging), etc.
  3. As mentioned by jburgess, handles AMF.
  4. Displays JSON, XML and other kind of responses in a tree structure, making it easier to read. Displays images in image responses instead of binary data.

Cons of Charles Proxy:

  1. Cost :-)

Solution 6 - Debugging

If you're developing an application that transfers data using AMF (fairly common in a particular set of GIS web APIs I use regularly), Fiddler does not currently provide an AMF decoder that will allow you to easily view the binary data in an easily-readable format. Charles provides this functionality.

Solution 7 - Debugging

To complement the list, also be aware of http://mitmproxy.org/

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionMichael MaoView Question on Stackoverflow
Solution 1 - Debuggingmikek3332002View Answer on Stackoverflow
Solution 2 - DebuggingMacy AbbeyView Answer on Stackoverflow
Solution 3 - DebuggingAlexView Answer on Stackoverflow
Solution 4 - DebuggingneimadView Answer on Stackoverflow
Solution 5 - DebuggingManu ManjunathView Answer on Stackoverflow
Solution 6 - DebuggingjburgessView Answer on Stackoverflow
Solution 7 - DebuggingMaxim VekslerView Answer on Stackoverflow