comprimir-css-php

Existen muchas técnicas para comprimir archivos con CSS, en esta entrada os enseñaré una más, usando PHP, reduciendo el número de peticiones HTTP si disponemos de varios archivos CSS.
La técnica se llama Reinhold Weber’s y combina todos los archivos CSS en uno, de forma que no tendrás que renombrar tus archivos CSS con una extensión PHP.

Los archivos CSS son incluidos pero los espacios en blanco no son eliminados, lo que facilita su lectura y depuración en herramientas como Firebug.

Para comprimir archivos CSS de este manera, sigue estos pasos:

1. Crea un archivo llamado styles.php en la misma ruta donde se encuentran tus archivos CSS.

2. Pega en el archivo anterior (styles.php) el siguiente código:

?php

if(extension_loaded('zlib')){

ob_start('ob_gzhandler');

}

header ('content-type: text/css; charset: UTF-8');

header ('cache-control: must-revalidate');

$offset = 60 * 60;

$expire = 'expires: ' . gmdate ('D, d M Y H:i:s', time() + $offset) . ' GMT';

header ($expire);

ob_start('compress');

function compress($buffer) {

// remove comments

$buffer = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $buffer);

return $buffer;

}

// list CSS files to be included

include('baseline.css');

include('styles.css');

if(extension_loaded('zlib')){ob_end_flush();}

?>

Necesitarás actualizar la ruta del fichero CSS, apuntando hacia styles.php. Normalmente esta llamada se encuentra entre la etiqueta de tu documento.

Los resultados:

Como puedes comprobar en la imagen siguiente, los 2 archivos CSS han sido convertidos a un solo archivo y el tamaño ha pasado de 11.2 KB a 3.2 KB. Los comentarios también se han removido del archivo, pero los espacios en blanco se han mantenido para evitar problemas por si existen fallos en la disposición del sitio (estructura).

comprimir-archivos-php

Esta técnica es muy efectiva para aligerar el peso de nuestro sitio, pero tenemos que estar seguros de que nuestro servidor no tiene “mod_deflate” activado en la configuración Apache.

Si deseamos ver más técnicas para comprimir CSS con PHP, echad un vistazo a Ethanandjamie.

Espero que esto os ayude a acelerar la carga de vuestro sitio.