sábado, 15 de enero de 2011

CSSTidy optimización de CSS


Para que preocuparnos de subir al servidor una hoja de CSS enorme que estará bien formada y pasará el estándar. Pero que pasa si os diría si podríamos ahorrar un 25% en un CSS.
El objetivo es que las CSS son un elemento base para cargar la web. Es necesario que se cargue/descargue lo mas rápido posible ya que es un elemento que esta en todas las páginas, y aun estado cacheado merece la pena que ocupe poco.
Una herramienta que se puede implementar en el servidor es CSSTidy, que contiene unas opciones para PHP bastante sencillas.
Ejemplo 1:
<?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();
?>
Ejemplo 2:
<?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 ser mejorada con alguna otra):
  • 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;
Y para terminar otra herramienta complementaria a esta es CSS Compressor.