Aquí tenéis un artículo que me ha encantado para ayudaros a comprimir los ficheros html, css y js por cortesía de de-mas.net que me ha ayudado a optimizar mas el ancho de banda. Yo de momento he seguido sus pasos y con el tiempo veré que tal ha ido.
A medida que aumentan las visitas a nuestro sitio web también aumenta la transferencia consumida. Si queremos evitar que el aumento sea desproporcionado, haciendo que nuestro hosting se quede pequeño, lo podemos evitar comprimiendo los ficheros html, css y js que enviamos al usuario desde el servidor, reduciendo el tamaño en un 60% y también el uso del procesador (el coste de compresión consume menos CPU que el tener una conexión abierta más tiempo para transmitir los ficheros). Si quieres puedes comprobar como quedaría tu web comprimida en esta página: port80.Para hacerlo existen varias maneras y la mejor que he encontrado (más rápida y fácil) es mediante el uso del .htaccess y un pequeño fichero en php. Los pasos son:

Aviso! Si usas wordpress y ya tienes habilitada la opción de compresión, desactivala (Opciones ->Lectura) ya que con el método que usa wordpress no comprime los css ni los js.

Paso 1.-Añadimos estas tres lineas al final del fichero .htaccess


# Activa la compresion en el servidor
php_flag zlib.output_compression On
# Indica el nivel de compresion de 1 a 9 (de menor a mayor compresion)
php_value zlib.output_compression_level 5
# Indica sobre que extensiones se aplica la compresion
AddHandler application/x-httpd-php .css .js

Paso 2.-Con el código anterior ya debería bastar, pero veremos que las páginas webs no se visualizarán correctamente en Firefox, pero si en el Internet Explorer. Esto es debido a que hemos machacado las cabeceras de los ficheros .css y .js y los envia con una cabcera html (”Content-type: text/html”). Para evitar esto deberemos incluir una linea más en el fichero .htaccess y subir un archivo nuevo al servidor:

Paso 2.1.-Crearemos el fichero contentHeader.php que dejaremos en nuestro servidor con el siguiente código:

<?php
$pathinfo = pathinfo($_SERVER['PHP_SELF']);
$extension = $pathinfo['extension'];
if($extension == "css"){
header("Content-type: text/css");}
if($extension == "js"){
header("Content-type: text/javascript");}
?>

Paso 2.2.-Añadimos la siguiente linea en el fichero .htaccess justo después de las anteriores:

# Si es un hosting compartido la "ruta_abosluta" seria por ejemplo /usr/home/de-mas.net/web/contentHeader.php
php_value auto_prepend_file /ruta_absoluta/contentHeader.php

Nota: Si no sabes tu ruta absoluta, no funcionará la página. Una forma de averiguarlo sería mediante un fichero php que te devuelva este valor:


<?php
$ruta_absoluta = getcwd();
echo $ruta_absoluta;
?>

Con estos dos últimos pasos lo que hacemos es formatear las cabeceras de los ficheros .css y .js para que Firefox las pueda interpretar correctamente.
Si queremos saber si nuestra web esta comprimida y ver los tiempos de carga, puedes descargarte el plugin Firebug para Firefox.

Los resultados se pueden apreciar con el siguiente ejemplo donde una web pasa de 28 KB a 8.5 KB, reduciendo el tamaño en un 70% y el tiempo de carga en un 33% (de 1282ms a 859ms).

Podemos comprobar con el plugin Firebug si la compresión se ha llevado mediante este tag de la cabecera HTTP

Fuente: de-mas.net


Vota este artículo:
1 Estrella2 Estrellas3 Estrellas4 Estrellas5 Estrellas (No Ratings Yet)
Loading ... Loading ...

Posts anterior y posterior:
«
»


Posts Relacionados: