Serve pre-compressed CSS/JS files

When file optimizations are applied, such as Minify CSS and JavaScript, WP Rocket creates 2 versions of each file: 

• a standard CSS/JavaScript file, with the .css or .js extension
• a pre-compressed GZIP version, with the .gz extension

Note that if a file is not processed by WP Rocket, e.g. it has min in the filename, or has been excluded, we will not create a pre-compressed version.

By default, WP Rocket adds rules in the htaccess file to GZIP the standard files dynamically.

But the pre-compressed files will not be served automatically due to the possibility of server conflicts. If you want to take advantage of these files, you must add the correct rules to your server configuration.

Apache

If you use Apache, you can add the correct rules to your htaccess file by installing the following helper plugin:

📥   Download (.zip):  WP Rocket | Add compressed assets htaccess rules
Developers: You can find the code for this plugin on GitHub.

The helper plugin adds the following rules to your htaccess file. We strongly recommend using the helper to add them instead of manually editing your file.

<IfModule mod_headers.c>
    RewriteCond %{HTTP:Accept-Encoding} gzip
    RewriteCond %{REQUEST_FILENAME}\.gz -f
    RewriteRule \.(css|js)$ %{REQUEST_URI}.gz [L]
    # Prevent mod_deflate double gzip
    RewriteRule \.gz$ - [E=no-gzip:1]
    <FilesMatch "\.gz$">
        # Serve correct content types
        <IfModule mod_mime.c>
            # (1)
            RemoveType gz
            # Serve correct content types
            AddType text/css              css.gz
            AddType text/javascript       js.gz
            # Serve correct content charset
            AddCharset utf-8 .css.gz \
                             .js.gz
        </IfModule>
        # Force proxies to cache gzipped and non-gzipped files separately
        Header append Vary Accept-Encoding
    </FilesMatch>
    # Serve correct encoding type
    AddEncoding gzip .gz
</IfModule>

NGINX

If you use NGINX, the following code should take care of it automatically:

location / {
    gzip_static on;
}

In this case, to service a request for /path/to/file, NGINX tries to find and send the file /path/to/file.gz. If the file doesn’t exist, or the client does not support gzip, NGINX sends the uncompressed version of the file.