We all know how dangerous blind spots are when driving. Before changing lanes or making a turn, you check your mirror and turn your head to ensure there is no car in your blind spot. Make a decision using the mirror alone and you could end up smashing into the car at 7’oclock. Same goes for performance monitoring and blind spots. Make a decision based on your monitoring tool alone without checking your blind spots and you could end up pointing fingers at the wrong person or wasting time trying to solve a problem that isn’t there.
Last year, we blogged about monitoring blind spots with Internet Explorer (IE7+) (Objects in IE Might Be Faster Than They Appear) and cautioned:
- Network monitoring tools at the browser layer don’t show actual network activity – can be impacted by other factors on the page.
- On IE, if a waterfall result shows long iframe network response time, don’t immediately put the fault at the server of the iframe.
- JavaScript execution times can be appended to iframe network response/receive times in IE based monitoring tools.
We recently received feedback from Microsoft on the issue, and decided to write a follow up to the original post.
The Symptoms
We came across the IE issue back in March 2011 when a client of ours approached us with surprising high network times on an iframe tag pointing to a URL, recorded from an IE7 performance monitoring service. The response content of the iframe was < 1k bytes, which fit in a single TCP packet, and yet the receive time (time from first to last byte of the HTTP content) was 500+ ms. This would suggest that the packet was fragmented and/or lost. We replicated the same results using different monitoring tools* as well as IE9 “Developer Tools” Network Tab.
To validate the speed bump was at the TCP protocol level, we utilized Wireshark to capture the packets. We confirmed the URL content was delivered in a single packet in less than 100 ms from when the request was sent (First Byte or Wait time). The network was behaving normally, so somehow IE was reporting something else.
The Tests
We inspected further and discovered that IE started executing JS on the page right after the DOMContentLoaded event was reached (or on pre-IE 9 browsers, an approximation of that event.) We created different test pages under the similar conditions and determined that IE was appending JS execution time to the network time of the iframe request. Tests on image requests did not yield the same behavior as for the iframes.
The Follow-up
We filed a bug with the Microsoft engineers for Internet Explorer pointing out the issue. They recently got back to us, confirming both the problem and stating this was expected behavior, and no changes would be made to fix the problem. Here is the information from Microsoft:
“Internet Explorer (IE) executes JavaScript on the same thread the UI is updated on. Consequently IE cannot be executing script and update the UI at the same time. In your example the page is manipulating the DOM by adding new nodes in a loop. At the same time the iframe’s content is being loaded. The DOMContentLoaded event fires before all the content in the iframe has loaded. As the DOMContentLoaded event signals that the DOM is ready for manipulation not that all its content has been fetched. For example images and other binary content might still be downloading. As your example is executing JavaScript in a loop the UI cannot be updated until after the function has returned and JavaScript is no longer executing. At that point you will see the UI update and other events occur such as the completion event for a network download. It’s worth noting that while network requests are downloaded on different threads their events and data are marshaled on to the UI thread. The network inspector reflects what a customer would see if they were to view the page. For monitoring focused exclusively on the network stack a tool like NetMon http://www.microsoft.com/download/en/details.aspx?id=4865 would it be more appropriate.”
There are no plans at this time to change this design aspect of IE but we appreciate your feedback.”
In other words, “Network Capture” in Internet Explorer Developer Tools is not a replacement for traditional network capture tools. The numbers can be impacted under some circumstances by other processes happening in the browser, at the UI thread. Of course this begs the question: “Why call it Network Capture, if it is not actual network data?”
Who Else Suffers?
Any tool capturing network related data on Internet Explorer, at the browser level is impacted by the problem. So far one specific case has been confirmed Iframes tag requests contenting with JavaScript executions that take longer to execute than the load of the iframe request.
Firebug for Firefox did suffer this problem early on, but seems to have solved. We have yet to observe any issuer on it, or hear of any problems.
“Developer Tools” on Chrome 15 and 16 seem have a blind spot. In certain requests that are less than 1k in size, the tool reports “Receiving” times above 0ms. The problem is very visible for 302 redirect response, which traditionally have only HTTP Headers, no Response body. It is unclear what the cause is, and we have yet to file a report with Chromium team.. To replicate the issue take a look at 302 redirect requests in the CNN Homepage:
Conclusion
The network tools provided by the browsers or built by third parties collecting data at the browser layer might not accurately measure request network time in certain conditions. Next time you see absurd times for a request, remember to test the request standalone to confirm the request is actually slow. Lastly, don’t be afraid of running Wireshark when the numbers continue to not make sense.
* HTTPwatch, DynaTrace, Webpagetest, Catchpoint IE monitor



I’m not sure I agree with your conclusions here. In the first case, IE reported the times correctly as perceived by the end user. All of these tools tell a story told from the user narrative point of view. If you want to see what your ethernet card’s experience is like, use netmon or wireshark. But users are waiting while IE is processing the scripts and that time needs to be included.
On the 302 issue, I think this is correct also, A 302 response does not take zero seconds; in each case, an HTTP request must be made, bytes must travel over the wire, a server spends some time thinking about the issue and then send a response, with more bytes traveling back over the wire. This process takes a small but finite and nonzero amount of time. In your screenshot, it looks likes a 302 reponse takes a few tens of milliseconds to your client’s location. This is the right order of magnitude for these responses. To convince yourself, look at Y! or G or any large site and see how long their 302 responses require.
This does bring up and interesting point however; a 302 is basically a null request, it gives you a good idea of the minimum time required, from the user’s point of view, to ask for and receive the smallest meaningful amount of ‘stuff’ over the wire from that server. In your screen shot you can also see that some 80 ms or so is used to parse the incoming HTML.
Since you are interested in seeing both the user-narrative (layer 7) response times as well as the layer 4 response times, one suggestion would be to use MS Virtual Roundtrip Analyzer. This tool, built on top of NetMon, offers a hybrid approach, allowing you to view the packet traffic and HTTP-related activity at the same time.
Regards,
D-
Hi Daniel,
Thank you for your comments. You are correct, the user did experience slowness due to the javascript execution. However, the IE dev tools (and others) are appending this JS processing time to the server time for a request that did not even deliver the JavaScript causing the issue. The tool is calling the feature Network Capture, is also using the same terminology for the same metrics used elsewhere for terms relating to HTTP transaction.
This causes a confusion with the users of these tools. When a developer looks at the data from the tool they think the server is slow and firmly believe the Iframe request is the cause when in fact is not and they should look at their JavaScript code. We have been in several calls between sites and 3rd party providers where they in heated arguments over this issue, and wasting money trying to figure out a problem that is not what it seems to be.
As about the 302 redirect issue, the 80ms reported by Chrome is not the parsing of the HTML. Receiving in Chrome, and all other tools, refers to the time it took the client to receive from the server the entire response – from 1st packet to the last packet. The response of the 302 redirect had no HTML – just HTTP headers, it was only 233 bytes which fits nicely in a single packet – hence the time for receiving should be 0. We have seen some cases where it shows 200ms+ (even on a mac) which makes it a little questionable. It shouldn’t take Chrome or any browser 50ms+ to get a single packet of data from the network layer to the application, in the same OS – unless something was blocking it?
As we stated in the conclusion of this article, we agree with you, if you want to confirm a problem with the server or network you should look at Netmon/Wireshark or other tools that capture at the network layer of the client. The one challenge there is with secure traffic and SPDY – you cannot clearly see what is going on.
Our goal with this post was to educate users to be careful on how they interpret the metrics provided, as they could potentially not be network related. We simply wanted to save people time and money by ensuring they focus on the right cause.
thanks
Catchpoint Team
Pingback: IE 9 Browser Network Capture Tool – Not a reliable Network Capture Tool to measure Latency. « Kiranbadi1991's Blog