Collapse Whitespace

Configuration

The 'Collapse Whitespace' filter is enabled by specifying:

Apache:
ModPagespeedEnableFilters collapse_whitespace
Nginx:
pagespeed EnableFilters collapse_whitespace;

in the configuration file.

Description

The 'Collapse Whitespace' filter reduces bytes transmitted in an HTML file by removing unnecessary whitespace.

Operation

The filter reduces the transfer size of HTML files by replacing contiguous whitespace with a single whitespace character. Because HTML is often formatted with extra whitespace for human readability or as an incidental effect of the templates used to generate it, this technique can reduce the number of bytes needed to transmit HTML resources.

For example, if the HTML document looks like this: 

<html>

  <head>
    <title>Hello,   world!   </title>
    <script> var x = 'Hello,   world!';</script>
  </head>

  <body>
    Hello, World!
    <pre>
      Hello,
        World!
    </pre>
  </body>

</html>

Then PageSpeed will rewrite it into: 

<html>
<head>
<title>Hello, world!</title>
<script> var x = 'Hello,   world!';</script>
</head>
<body>
Hello, World!
<pre>
      Hello,
        World!
</pre>
</body>
</html>

Example

You can see the filter in action at www.modpagespeed.com on this example.

Requirements

The 'Collapse Whitespace' filter will not modify whitespace appearing within <pre>, <textarea>, <script> and <style>. Extraneous whitespace within inline scripts and styles can be removed using the JS Minify and CSS Minify filters.

The 'Collapse Whitespace' filter will attempt to preserve newline characters to an extent -- a contiguous sequence of whitespace with at least one newline anywhere in it will always collapse to a single new line. Why? See the collapse newlines entry in the FAQ.

Risks

Although contiguous whitespace in HTML (beyond the first space) is normally ignored by the browser outside of tags like <pre> and <textarea>, one can use CSS properties such as "white-space: pre" to make the browser preserve whitespace within a portion of the document: compare this example with and without the filter enabled.

Use of such properties is relatively rare, however, the 'Collapse Whitespace' filter is not yet CSS-aware, so any pages that might use such CSS properties (either statically or dynamically) should not use this filter at this time.