CSSTidy: optimizar CSS es fácil

Una de las cosas por las que no solemos preocuparnos mucho es por los CSS. Solemos hacer un CSS más o menos bien formado, pero a partir de ahí nos limitamos a subirlo al servidor y poco más. Pero… si os digo que se puede ahorrar hasta un 25% en un CSS, ¿no sería interesante aplicarlo?

La idea es que los CSS, al ser un elemento de los que se han de cargar antes que «se pinte» el HTML interesa que sea rápido en descargar. Además, es un elemento que suele estar en todas las páginas, y aunque el navegador suele cachearlo, vale la pena que ocupe poco…

Una de las herramientas que podemos implementar directamente en nuestro servidor es el CSSTidy, que tiene unas opciones para PHP bastante sencillas.

El ejemplo básico podría ser este:

<?php
include('class.csstidy.php');
$css_code = "a {
  color:black;
  background-color:blue;
}";
$css = new csstidy();
$css->set_cfg('remove_last_;',TRUE);
$css->parse($css_code);
echo $css->print->formatted();
?>

Un ejemplo no tan básico podría ser este:

<?php
$css_code = file_get_contents("http://www.example.com/estilo.css");
include("class.csstidy.php");
$css = new csstidy();
$css->set_cfg("preserve_css",true);
$css->load_template('high_compression');
$css->parse($css_code);
$min = $css->print->plain();
?>

Las opciones que yo dejaría son (aunque puede que se pueda mejorar con alguna otra combinación):

• remove_bslash = true;
• compress_colors = true;
• compress_font-weight = true;
• lowercase_s = true;
• optimise_shorthands = 0;
• remove_last_; = true;
• case_properties = 0;
• sort_properties = true;
• sort_selectors = true;
• merge_selectors = 1;
• discard_invalid_properties = true;
• css_level = ‘CSS2.1’;
• preserve_css = true;
• timestamp = false;

En fin, una interesante herramienta que podemos ver en acción directamente en CSS Compressor, que es la herramienta que habitualmente utilizo yo.