User Guide

Pagespeed options

By default Webscale enables these filters, with the default settings as specified by Add_head

This filter exists primarily to ensure that other filters have a place to insert new tags that needs to be in the head, or that trigger on the closing-tag for a head to perform some other action.

1. Canonicalize_javascript_libraries

https://www.modpagespeed.com/doc/filter-canonicalize-js

This filter identifies popular JavaScript libraries that can be replaced with ones hosted for free by a JavaScript library hosting service — by default the Google Hosted Libraries. This has several benefits:

Most important, first-time site visitors can benefit from browser caching, since they may have visited other sites making use of the same service to obtain the libraries.

The JavaScript hosting service acts as a content delivery network for the hosted files, reducing load on the server and improving browser load times.

There are no charges for the resulting use of bandwidth by site visitors.

The hosted versions of library code are generally optimized with third-party minification tools. These optimizations can make use of library-specific annotations or minification settings that aren’t portable to arbitrary JavaScript code, so the libraries benefit from more aggressive optimization than can be provided by PageSpeed.

2. Combine_css

https://www.modpagespeed.com/doc/filter-css-combine

‘Combine CSS’ seeks to reduce the number of HTTP requests made by a browser during page refresh by replacing multiple distinct CSS files with a single CSS file, containing the contents of all of them. This is particularly important in old browsers, that were limited to two connections per domain. In addition to reduced overhead for HTTP headers and communications warm-up, this approach works better with TCP/IP slow-start, increasing the effective payload bit-rate through the browser’s network connection.

3. Convert_meta_tags

https://www.modpagespeed.com/doc/filter-convert-meta-tags

The ‘Convert Meta Tags’ filter adds a response header that matches each meta tag with an http-equiv attribute. For example, HTML

<meta http-eqiv=”Content-Type” content=”text/html; charset=UTF-8″>

would add an HTTP header:

Content-Type: text/html; charset=UTF-8

in the response headers.

The original tag is left unchanged.

Certain http-equiv meta tags, specifically those that specify content-type, require a browser to reparse the html document if they do not match the headers. By ensuring that the headers match the meta tags, these reparsing delays are avoided.

4. Extend_cache

https://www.modpagespeed.com/doc/filter-cache-extend

‘Extend Cache’ seeks to improve the cacheability of a web page’s resources without compromising the ability of site owners to change the resources and have those changes propagate to users’ browsers.

The ‘Extend Cache’ filter rewrites the URL references in the HTML page to include a hash of the resource content (if rewrite_css is enabled then image URLs in CSS will also be rewritten). Thus if the site owners change the resource content, then the URL for the rewritten resource will also change. The old content in the user’s browser cache will not be referenced again, because it will not match the new name.

5. Flatten_css_imports

https://www.modpagespeed.com/doc/filter-flatten-css-imports

flatten_css_imports parses linked and inlined CSS and flattens it by replacing all @import rules with the contents of the imported file, repeating the process recursively for each imported file. It works on CSS found in <style> blocks and <link> references.

6. Inline_css

https://www.modpagespeed.com/doc/filter-css-inline

The “Inline CSS” filter reduces the number of requests made by a web page by inserting the contents of small external CSS resources directly into the HTML document. This can reduce the time it takes to display content to the user, especially in older browsers.

7. Inline_import_to_link

https://www.modpagespeed.com/doc/filter-css-inline-import

The “Inline @import to Link” filter converts a <style> tag consisting of only @import statements into the corresponding <link> tags. This conversion does not itself result in any significant optimization, rather its value lies in that it enables optimization of the linked-to CSS files by later filters, in particular the combine_css, rewrite_css, inline_css, and extend_cache filters.

8. Inline_javascript

https://www.modpagespeed.com/doc/filter-js-inline

The “Inline JavaScript” filter reduces the number of requests made by a web page by inserting the contents of small external JavaScript resources directly into the HTML document. This can reduce the time it takes to display content to the user, especially in older browsers.

9. Insert_dns_prefetch

https://www.modpagespeed.com/doc/filter-insert-dns-prefetch

DNS resolution time varies from <1ms for locally cached results, to hundreds of milliseconds due to the cascading nature of DNS. This can contribute significantly towards total page load time. This filter reduces DNS lookup time by providing hints to the browser at the beginning of the HTML, which allows the browser to pre-resolve DNS for resources on the page.

10. Rewrite_css and Fallback_rewrite_css_urls

https://www.modpagespeed.com/doc/filter-css-rewrite

This filter parses linked and inline CSS, rewrites the images found and minifies the CSS. The filter works on CSS found in <style> blocks and <link> refs.

Many images are referenced from CSS rather than HTML. If rewrite_images, recompress_images,recompress_jpeg, recompress_png, recompress_webp, convert_gif_to_png, convert_jpeg_to_webp,convert_png_to_jpeg, or extend_cache are enabled this filter finds and rewrites those images, saving bytes and extending cache lifetimes.

The CSS parser cannot parse some CSS3 or proprietary CSS extensions. If fallback_rewrite_css_urls is not enabled, these CSS files will not be rewritten at all. If the fallback_rewrite_css_urls filter is enabled, a fallback method will attempt to rewrite the URLs in the CSS file, even if the CSS cannot be successfully parsed and minified.

Minification can drastically reduce the byte count in common CSS by stripping all comments and most whitespace and shortening color names. This filter can be used to avoid the extra step of minifying CSS by hand when constructing and maintaining a site. This practice reduces the payload size.

11. Rewrite_javascript

https://www.modpagespeed.com/doc/filter-js-minify

This filter minifies JavaScript code, using an algorithm similar to that in Douglas Crockford’s popular JSMin program. At present, the filter strips all comments and most whitespace. The filter works only on JavaScript found in <script> blocks (either as the target of the src attribute, or within the body of the block).

Minification can drastically reduce the byte count in common JavaScript code. This filter can be used to avoid the extra step of minifying Java code by hand when constructing and maintaining a site.

This practice reduces the payload size.

12. Rewrite_style_attributes_with_url

https://www.modpagespeed.com/doc/filter-rewrite-style-attributes

The “Rewrite Style Attributes” filter rewrites CSS inside elements’ style attribute. It requires rewrite_css to also be enabled. See the settings for rewrite_css to control CSS minification, image rewriting, image recompression, and cache extension.

rewrite_style_attributes enables the filter for all style attributes.

rewrite_style_attributes_with_url enables it only for style attributes that contain the text ‘url(‘, for which you will generally want to enable one or more image optimization filters.

rewrite_style_attributes_with_url is more efficient because it does not always parse the CSS, but it will not optimize CSS that doesn’t reference any URLs. rewrite_style_attributes will always parse the CSS and optimize everything possible. Because images are generally the source for greatest improvement and are enclosed in url(), rewrite_style_attributes_with_url is a good balance for most uses, while rewrite_style_attributes is available for more aggressive optimization.

These two options below specify groups of image optimizations that will try to do the best thing to make images high quality and fast. Please refer to the pagespeed site for details at https://www.modpagespeed.com/doc/reference-image-optimize

13a. Rewrite_images

This is a filter group that includes inline_images, recompress_images, convert_to_webp_lossless, and resize_images.

13b. Recompress_images

This is a filter group consisting of convert_gif_to_png, convert_jpeg_to_progressive, convert_jpeg_to_webp, convert_png_to_jpeg, jpeg_subsampling, recompress_jpeg, recompress_png, recompress_webp, strip_image_color_profile, and strip_image_meta_data.