Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Select an option

  • Save johnkingzy/04c162dd9f11b01b8702d49a7b1a1a54 to your computer and use it in GitHub Desktop.

Select an option

Save johnkingzy/04c162dd9f11b01b8702d49a7b1a1a54 to your computer and use it in GitHub Desktop.

Revisions

  1. @osvik osvik created this gist Aug 10, 2014.
    42 changes: 42 additions & 0 deletions manual-gzip-howto-and-test.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,42 @@
    <!DOCTYPE html>

    <html>
    <head>
    <meta charset="utf-8" />
    <title>Manually gzip CSS and JS files</title>
    <link rel="stylesheet" href="bootstrap-custom.min.css" type="text/css">
    <script src="header-scripts.min.js"></script>
    </head>

    <body>

    <h1>Manually gzip CSS and JS files and serve them with Apache</h1>

    <p>A Compress all the files first. Run the command:</p>

    <pre>gzip -r *.js *.css</pre>

    <p>This will find all the Javascript and CSS files in the current directory and its subdirectories. They will be compressed into new files with a .gz extension added (ie, script.js becomes script.js.gz, there will not be a script.js left).
    </p>

    <p>Now edit .htaccess:</p>

    <pre>

    RewriteEngine on
    RewriteCond %{HTTP:Accept-encoding} gzip
    RewriteCond %{REQUEST_FILENAME}\.gz -s
    RewriteRule ^(.*)\.(js|css)$ $1\.$2\.gz [QSA]

    RewriteRule \.css\.gz$ - [T=text/css,E=no-gzip:1,E=manualgzip:1]
    RewriteRule \.js\.gz$ - [T=text/javascript,E=no-gzip:1,E=manualgzip:1]

    &lt;ifmodule mod_headers.c&gt;
    # setup this header only if rewrites above were used
    Header set Content-Encoding "gzip" env=manualgzip
    &lt;/ifmodule&gt;

    </pre>

    </body>
    </html>