Cómo habilitar la compresión GZip en tu servidor web

Hay pocas cosas que sean tan sencillas de implementar y que tengan un impacto espectacular en el rendimiento, como habilitar la compresión GZip. Aprende cómo hacerlo en tu servidor.

¿Alguna vez te ha pasado que tengas que tu servidor de correo no te permita enviar un mensaje por algún archivo adjunto que pesa demasiado?. Seguramente lo has solucionado comprimiendo el fichero.

Tu servidor web puede hacer esto mismo, de manera transparente, simplemente habilitando una opción.

¿Qué beneficios tiene habilitar la compresión GZip?

Cada día, los contenidos de Internet se consumen cada vez más desde dispositivos móviles. Aunque las redes 4G cada vez cubren más territorio, hay factores externos que provocan que la cobertura que llega a los dispositivos no sea siempre la adecuada.

En estos casos, el salto de 4G a una red más lenta, como 3G o inferior, hace que la velocidad de descarga se degrade notablemente. Se entiende mejor viendo los números. Veamos cuánto tardaríamos en descargarnos 1MB dependiendo de la red:

• 3G (200 kilobits por segundo, o más): unos 30 segundos
• ADSL (de hasta 10Mb): unos 4 segundos
• 4G (100 megabits por segundo, o más): ¡0 segundos!

El tiempo que se tarda en descomprimir un fichero de 1MB se contabiliza en milisegundos, por lo que no hay razón para no habilitarlo.

Los estudios en sitios web como Amazon o eBay han demostrado que cada segundo que tarda una página web en cargar, hace que el abandono de un visitante, crezca exponencialmente.

¿Alguna vez te has aguantado esperando 30 segundos por una web?, tus visitantes tampoco lo harán.

¿Por qué elegir GZip (o Deflate) en lugar de Brotli?

Brotli es otro de los muchos algoritmos de compresión que hay, con una velocidad similar a GZip, que optimiza mucho más los ficheros.

Si bien Brotli tiene un mayor ratio de compresión, frente a GZip, lo cierto es que las implementaciones son relativamente recientes, por lo que no todos los dispositivos lo soportan.

Según la web Can I use, la penetración de Brotli en los navegadores es de un 86%. En cuanto a GZip, se da por bueno que la penetración de esta tecnología es del 100%, estando presente incluso en versiones muy viejas de Internet Explorer.

Aunque todos los navegadores nuevos lo vayan a implementar, los antiguos no se siguen actualizando, a pesar de seguir teniendo una cantidad respetable de usuarios. La única esperanza es que esos navegadores se dejen de utilizar con el paso del tiempo.

Mi consejo es que todavía utilices GZip durante un tiempo, mientras el porcentaje de penetración de los nuevos navegadores siga incrementando.

Compresión GZip en Nginx 1.14

Nginx trae por defecto el soporte para servir los ficheros HTML mediante GZip, por lo que únicamente tendremos que configurarlo para que comprima también el resto de tipos de fichero que queramos.

Un ejemplo de configuración:

http {
  server {
    location / {
      # Activa la compresión GZip
      gzip on;

      # Desactiva la compresión GZip en navegadores
      # Internet Explorer demasiado viejos
      gzip_disable "msie6";

      # Añade a continuación los tipos de ficheros
      # que quieras comprimir:
      gzip_types
        text/css
        text/javascript
        text/plain
        application/json
        application/javascript
        font/truetype
        font/opentype
        image/svg+xml;

      # Añade la cabecera "Vary: Accept-Encoding" para
      # evitar problemas con cachés intermedias
      gzip_vary on;
    }
  }
}

Puedes ver el resto de las opciones en la documentación oficial del módulo.

¡Listo! Reinicia el servidor, o recarga la configuración, para aplicar los cambios.

Compresión GZip en Apache 2.4

En Apache es tan fácil como en Nginx. Basta con elegir los tipos de fichero que quieres que el servidor comprima.

Añade estas lineas a tu fichero .htaccess:

<ifmodule mod_deflate.c>
    AddOutputFilterByType DEFLATE "text/html" \
                                  "text/css" \
                                  "text/plain" \
                                  "text/xml" \
                                  "application/x-javascript" \
                                  "application/x-httpd-php"
</ifmodule>

Al igual que con el ejemplo de Nginx, tendrás que añadir los tipos mime que quieras servir comprimidos. Por ejemplo, para las imágenes SVG sería “image/svg+xml”.

Conclusión

No encontrarás algo tan sencillo de implementar que te de tantos beneficios en cuanto a la velocidad de carga de tu web. ¡Pero no te detengas aquí!, hay muchas cosas que mejorar en una página web, día a día.

¡Nos leemos en el próximo artículo!