List of Figures

 

Chapter 1. High-speed websites

Figure 1.1. The performance cycle

Figure 1.2. A basic page request

Figure 1.3. Average bytes per page by content type (source: httparchive.org). The 250,000 URLs that produce this chart are made up by a large percentage of www.alexa.com’s top websites, as well as additional user-submitted websites.

Chapter 2. First steps toward a faster website

Figure 2.1. An HTTP GET request

Figure 2.2. An HTTP GET response

Figure 2.3. Multiple requests to www.mozilla.org

Figure 2.4. The difference between an empty cache and a primed cache. Notice the differences in the total weight and the number of HTTP requests.

Figure 2.5. Waterfall chart for www.deanhume.com

Figure 2.6. Waterfall chart for Asos.com

Figure 2.7. Accessing Chrome developer tools

Figure 2.8. Waterfall chart for www.deanhume.com using Chrome developer tools. The figure also shows the latency that can sometimes be associated with the download time of a component.

Figure 2.9. Waterfall chart for www.deanhume.com using IE developer tools

Figure 2.10. Waterfall chart for www.deanhume.com using www.webpagetest.org

Figure 2.11. Yahoo! YSlow tool run against www.deanhume.com

Figure 2.12. Google PageSpeed tool run against www.deanhume.com

Chapter 3. Compression

Figure 3.1. A typical HTTP request and response for www.bing.com. Notice the Accept-Encoding and Content-Encoding headers.

Figure 3.2. The difference in file sizes before and after using Gzip