Utility Spotlight Visual Round Trip Analyzer
Web engineers! Are you looking at performance problems in your application caused by the network? Most performance engineering efforts focus on measuring server response time as the primary cause of slow Web pages. Server response issues certainly need to be tracked and resolved, but many Web sites are still perceived as slow even when the servers are fast. Focusing on the network download pattern between client and server(s) can produce huge performance wins, and that's something the free Web performance analysis tool, Visual Round-trip Analyzer (VRTA), can help you with.
Recently, we announced the public release of VRTA in the November issue of MSDN Magazine. In the column, "12 Steps to Faster Web Pages," I discussed many of the visual aspects of the tool, such as how the tool shows files downloading in series or parallel. That column really focused on the deep-dive troubleshooting that VRTA brings to the table, but suppose you're more interested in generating a simple business summary of a Web site's performance issues. In this column, I will look at the Expert Analysis report that is built into VRTA.
This new expert makes it easy to quickly identify download performance problems. VRTA evaluates a Web site against a list of known best practices and grades the site for each of these, A through F. Let me show you how it works.
The TechNet Magazine Web site is a good site to analyze. First, let's make sure we are all starting with the same download. I want to look at the site as a first time user would see it, with no cached files already downloaded. We call this Page-Load-Time 1 (PLT1), a first time user. A user coming back the next day would have cached files. We call that PLT2.
If you are testing the same site over and over as PLT1, you will need to delete the cache each time and close all TCP connections. To do this, go to an About:blank, delete the cached files, then close and reopen the browser to the test site, in this case technet.microsoft.com/magazine/default.aspx. Before I navigate to this site, I will start the VRTA tool. See the VRTA download site for the tool. When the page has finished loading, I will stop VRTA and open the Analysis report. Figure 1 shows a summary of the results from the Expert.
This high level summary of the best practices indicates the Web page has several problems with performance. The overall score is a 'C'. The site is said to "perform moderately." It appears there are problems with the efficiency of the download, expiration dates, too many small images, and too much white space.
Let's have a look at the exceptions reports under the Analysis tab of Visual Round-trip Analyzer. This is a list of known Best Practices, as in Figure 1. For each, we give you an idea of how the Best Practice works and what parameters we are looking for.
Bandwidth Efficiency (Score = F) Bandwidth Efficiency Rate (BER) is a primary indication of how well a Web page is able to utilize the available bandwidth. Applications that do not follow such best practices as downloading on parallel TCP ports and using Keep-Alives and larger files will not sustain high bit rates on longer latency wide area networks (WANs). A score of A is given to 80% BER and above. BERs of 40% and below are given a score of F. The math for this rule is BER = AvgBitRate / MaxBitRate.
For our test of the TechNet Magazine site the analysis indicates that though the Web site is downloading at a maximum bit rate of 3Mbps (3022Kbps), it is averaging only 523Kbps. That's an average of only 17%of the max—not very efficient. The ideal Web page ramps up to max bit rate and then stays at max bit rate until the page is completed. Instead, many sites download at a trickle or in short bursts. The score for this rule reflects of all the other best practices (known and unknown).
Expiration Date (Score = F) This rule checks for expiration dates. When a user returns to a site, many of the needed files are already in the cache and will be reused, but first the browser will check to see if a file is still good. If no expiration date is found, the browser will send a Get-If-Modified request to the server.
Most files will not have been updated and will get a 304-Not-Modified. This wastes time and server resources. A better idea is to set expiration dates to three years out, then change the filename, path, or argument string to force a new file version download. Max-Age is an alternative to Expiration dates and is also checked. A grade of A is given for files whose Max Age is greater than one year.
The files in Figure 2 were found to either have no expiration date or to have one that is less than one year away. Many of the files in this site do not have expiration dates set, or they have them set to really short periods. Max Age is specified in seconds and 7,200 seconds is only two hours, so a user coming back the next day would request these files again (Get if-modified), instead of using their cached files from today. This wastes server capacity and network resources as well as user time.
Moreover, as I click through several pages on the site, I notice the same files are used on many pages. Each time a user goes to the next page, the browser sends a "get-if-modified" request for each file, to which "304-Not modified" is a common response from the server, again wasting time and resources.
Time to First Byte(Score = D) This rule checks the server response time. TTFB is the time from the Get packet until the first response packet. Subtracting the TCP connect time from the TTFB gives the server response time. A response time of less than 30ms is scored as an A, while a time greater than 100ms is an F.
The files in Figure 3 have long server time (seconds). Here we see several files that take longer than 30ms for a response from the server. The VRTA tool has already subtracted the network delay time by looking at the TCP connect time. Most servers can respond in less than 10ms when only a disk seek is required, so 400ms for the server to respond is a very long time.
Image clustering (Score = F) This rule checks the number of small image files. The site we looked at has 28 files that are under 4KB. TCP does a poor job downloading smaller files. It's much like going grocery shopping and only getting one item at a time, then going home and coming back later for another one item, over and over again. It's far better to consolidate many smaller files into fewer large files so that TCP can send more packets per round-trip. With images, we call this image clustering, and it involves putting many small images side-by-side in one file and then cropping them out and placing them on the page on the client side.
These are but a very small set of examples of what the VRTA tool can show you about your Web page. The VRTA download is available online. Try it on your site and see how many problems can be solved. You'll find that many of them are "low hanging fruit" and can be fixed with just a little effort.
Jim Pierson has been with Microsoft for 12 years, 5 of which were focused on Web Performance Engineering. Jim is Principal Group Manager in the GlobalPerf team that provides tools for measurement, analysis, and training of best practices to the online services of MSN and Windows Live.