CSS-JS-BOOSTER

Continuando con la optimización de Páginas Web, hoy vamos a hablar de otra herramienta que es capaz de optimizar el uso de CSS y JavaScript por parte de nuestra página Web.

La herramienta es CSS-JS-BOOSTER (visitar página web).

CSS-JS-BOOSTER es una herramienta en PHP, totalmente gratuita y sencilla de utilizar. Hay que descargarse las librerías, añadirlas a nuestro proyecto y modificar la carga de CSS y JS para que utilice dicha librería.

Con esta herramienta podemos minimizar nuestros CSS y JS, podemos fusionar todos nuestros CSS y JS para reducir el número de ficheros a cargar por parte de nuestra web, y también tiene la opción de trabajar con ficheros gzip para servir el contenido web.

Como se puede ver, es una herramienta bastante interesante, estoy haciendo la integración con el proyecto y confío que los resultados sean los esperados (ya lo contaré).

Como parte un poco negativa, indican que tras la modificación de algún CSS ó JS, la primera carga tardará más de lo deseado, pero hay que tener en cuenta que en la primera carga es cuando genera todos los ficheros optimizados.

CSS Minify

El primer objetivo del proyecto es hacer una web ligera, para ello estamos viendo las diferentes técnicas para hacer adelgazar una web.

Hay una guía bastante curiosa en http://browserdiet.com/es/ donde hay truquitos interesantes.

Hoy he empezado con la minimización de CSS y JS, aunque un código bien estructurado ayuda a la hora de desarrollar, a la hora de la carga en el navegador, el exceso de espacios y lineas hace que el fichero pese más, con lo que se recomienda la eliminación de todo aquello no necesario.

Con el fin de automatizar esa tarea, he encontrado un plugin para NetBeans (JS CSS Minify Compress) que facilita esta tarea, se escoje el fichero a minimizar…y con el botón derecho se le indica que se quiere minimizar y ya obtenemos el mismo fichero pero sin información innecesaria.

Parece que no, pero hay ganacias importantes, y para muestra, una imagen.

Image