List of Tables

Chapter 1. Understanding web performance

Table 1.1. A comparison of page-load times across various devices. Results vary depending on the amount of data and the display density of the device.

Table 1.2. A comparison of text assets on the client’s website before and after the application of server compression

Table 1.3. A comparison of image sizes before and after their optimization using the TinyPNG web service

Table 1.4. A comparison of page weights for the client’s website for various device types before and after optimizations have been made

Chapter 3. Optimizing CSS

Table 3.1. Selector types used in the test, and examples of those selectors in the test

Table 3.2. Benchmark results of CSS transitions vs. jQuery’s animate method in Google Chrome

Chapter 4. Understanding critical CSS

Table 4.1. Critical components and their related parent container selectors. These selectors can be used to search for styles for the components in the site’s LESS files.

Chapter 5. Making images responsive

Table 5.1. You can choose an Image format based on the type of content for your site. Each image for mat varies in color restrictions, image type, and compression category. (Full color indicates a range of 16.7 million or more colors, 24/32-bit.)

Table 5.2. Images, their resolutions, and their target media query breakpoints in the website’s CSS

Table 5.3. Background images for the #masthead selector in the CSS, their resolution, and the high DPI screen media queries

Table 5.4. An inventory of images in the website’s img folder and their widths, which will be used for the srcset attribute

Chapter 6. Going further with images

Table 6.1. SVG icons in the recipe website that you’ll combine into an image sprite

Table 6.2. Icon images and the LESS mixins needed to replace them

Table 6.3. Screen DPI as it relates to the size of images and the total load time of the page

Chapter 7. Faster fonts

Table 7.1. The available font variants in the Open Sans font family, their font-weight values, and whether they’ll be used on the page

Table 7.2. Font formats, along with their file extensions and browser support. Opera Mini doesn’t support custom fonts.

Table 7.3. Embedded fonts’ font-family property values and their associated CSS selectors

Chapter 10. Fine-tuning asset delivery

Table 10.1. Asset types for the Weekly Timber website, their modification frequencies, and the Cache-Control header value that should be used

Chapter 12. Automating optimization with gulp

Table 12.1. Essential gulp plugins

Table 12.2. CSS-related gulp plugins

Table 12.3. JavaScript-related gulp plugins

Table 12.4. Plugins related to image optimization

Appendix B. Native equivalents of common jQuery functionality

Table B.1. jQuery versus native element selection methods