Skip to content

Instantly share code, notes, and snippets.

@osvik

osvik/manual-gzip-howto-and-test.html

Created August 10, 2014 17:08
Show Gist options
  • Save osvik/9b3ff2d87bd2d131de11 to your computer and use it in GitHub Desktop.
Save osvik/9b3ff2d87bd2d131de11 to your computer and use it in GitHub Desktop.
Download ZIP
How to manually gzip CSS and JS files and serve them with Apache
Raw
manual-gzip-howto-and-test.html
<!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>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment