Comprimir archivos JS y CSS de tu sitio

Ya que estoy probando el framework para javascript EXTJS, tuve dudas en usarlo por su tamaño (~500Kb). Pero buscando encontré esta solución que es muy interesante, fácil y necesaria de usar.

Es una cabecera para comprimir el archivo que quieras, en este caso javascript y css.

¿Como?

1) Creamos el archivo compresor para CSS:
gzip-css.php

'<'?php
 ob_start ("ob_gzhandlerCSS");
header("Content-type: text/css; charset: UTF-8");
header("Cache-Control: must-revalidate");
$offset = 60 * 60 ;
$ExpStr = "Expires: " .
gmdate("D, d M Y H:i:s",
time() + $offset) . " GMT";
header($ExpStr);
?'>'

2) Creamos el archivo compresor de JS:

gzip-js.php

'<'?php ob_start ("ob_gzhandlerJS"); header("Content-type: application/x-javascript; charset: UTF-8"); header("Cache-Control: must-revalidate"); $offset = 60 * 60 ; $ExpStr = "Expires: " . gmdate("D, d M Y H:i:s", time() + $offset) . " GMT"; header($ExpStr); ?'>'

3) Creamos el .htaccess:

.haccess

AddHandler application/x-httpd-php .js
php_value auto_prepend_file ../lib/gzip-js.php
AddHandler application/x-httpd-php .css
php_value auto_prepend_file ../lib/gzip-css.php

Notas:

• @ '../lib/' es la ruta del archivo que llamamos.
• @ Este archivo debe estar en el mismo directorio que los archivos CSS y JS.

Descargar Ejemplo


Referencias:

The Definitive Post on Gzipping your CSS
How to implement GZIP using PHP