Cómo activar la compresión Brotli en Nginx

LinuxNginx

Brotli es una librería para servidores que permite comprimir los datos en el servidor antes de que éstos sean enviados al navegador del usuario. Es un método más moderno que gzip/deflate y más seguro, ya que solamente funcionará cuando utilizas el protocolo seguro HTTS. En este tutorial veremos cómo activar el módulo Brotli en Nginx bajo Linux, aunque antes veremos sus ventajas en comparación con otros sistemas de compresión.

Por qué utilizar Brotli con Nginx

El algoritmo de Brotli permite comprimir los datos utilizando una variante del algoritmo LZ77. Su ratio de compresión es equiparable al de los métodos generales de compresión que solemos utilizar en sistemas locales, pero con la ventaja de que su rapidez es similar a la de los métodos deflate o gzip. En el siguiente enlace puede encontrar más información acerca de Brotli.

En general, las ventajas de Brotli en comparación con el método gzip son que utiliza un diccionario para muchos elementos, por lo que solamente tiene que almacenar las claves de sus elementos a comprimir en lugar de las palabras completas. Debido a esto, las ventajas de Brotli salen a la luz a la hora de comprimir archivos HTML, archivos JavaScript y archivos CSS. El tamaño de los archivos HTML resultantes comprimidos con Brotli será un 25% inferior en relación con los archivos comprimidos mediante Gzip. Los archivos JavaScript ocuparán un 15% menos y los archivos CSS ocuparán entre un 15% y un 20% menos.

Cómo activar Brotli en Nginx

Antes de nada, es importante que tengas instalado tanto el servidor web Nginx como Git, ya que necesitaremos esta herramienta para descargarnos lo librería. Si no lo tienes instalado Git en tus sistema, consulta la Guía de instalación de Git. Para instalar Brotli en sistemas que utilicen el servidor Nginx, debes seguir los pasos que se describen a continuación:

  1. Lo primero que debes hacer es descargarte el repositorio de Brotli en tu servidor clonando el repositorio:
    yum install pcre-devel cmake -y
    cd usr/local/src
    git clone https://github.com/google/brotli.git
    cd brotli
  2. Ahora vamos a hacer un checkout con Git de la versión de Brotli que queremos instalar. Si quieres ver un listado de todas las versiones disponibles, utiliza el comando git branch:

    git branch
  3. En este caso instalaremos la versión v1.0, pero podrás instalar cualquier otra:

    git checkout v1.0
  4. Compila la librería con el comando make:

    ./configure-cmake
    make && make install

Tras la instalación de Brotli, debes instalar el módulo específico para Nginx. En principio debería funcionar con cualquier versión de  Nginx superior a la 1.16. Para instalar el módulo sigue estos pasos:

  1. Lo primero que debes hacer es descárgate el módulo de Brotli desde estie enlace.
  2. Dependiendo de la localización de Nginx en tu sistema, tendrás que ejecutar unos u otros comandos:
    • Si Nginx está en el directorio /usr/lib64/nginx:
      cd /usr/lib64/nginx

      Si el directorio modules no existe, debes crearlo:

      mkdir modules
    • Si Nginx está en el directorio /etc/nginx/modules:
      cd /etc/nginx/modules
  3. Lo primero que debes hacer es descargarte el módulo de Brotli desde este enlace. Los archivos que necesitamos están en la carpeta /src. Puedes descargarlos manualmente y copiarlos al directorio de módulosd e Nginx del paso anterior o también puedes clonar el repositorio y mover los archivos:
    mkdir brotli_nginx
    git clone https://github.com/google/ngx_brotli.git ./brotli_nginx
    mv ./brotli_nginx/ngx_http_brotli_filter_module.c ./
    mv ./brotli_nginx/ngx_http_brotli_static_module.c ./
    rm -rf ./brotli_nginx
  4. Tras copiar los archivos, todavía tenemos que activar el módulo Brotli en el archivo de configuración de Nginx, que suele estar localizado en el directorio /etc/nginx/nginx.conf. Puedes editar este archivo con el editor de texto nano, el editor vim o cualquier otro. En este caso usaremos nano:
    nano /etc/nginx/nginx.conf
  5. Una vez abierto el archivo, agrega estas dos líneas en la parte superior del archivo:
    load_module "modules/ngx_http_brotli_filter_module.so";
    load_module "modules/ngx_http_brotli_static_module.so";

    También tendrás que agregar la configuración del módulo en la sección http del archivo nginx.conf:

    # Configuracion de Brotli
        brotli              on;
        brotli_comp_level   7;
        brotli_static       on;
        brotli_types        text/xml image/svg+xml application/x-font-ttf image/vnd.microsoft.icon application/x-font-opentype application/json font/eot application/vnd.ms-fontobject application/javascript font/otf application/xml application/xhtml+xml text/javascript  application/x-javascript text/plain application/x-font-truetype application/xml+rss image/x-icon font/opentype text/css image/x-win-bitmap;

    Las opciones anteriores sirven para lo siguiente:

    • brotli: Activa o desactiva la compresión Brotli
    • brotli_comp_level: Nivel de compresión. Puedes establecer valores que van de 0 a 11. A mayor compresión, menos ocuparán los archivos, pero más tiempo tardarán en comprimirse y descomprimirse. Es importante establecer un balance intermedio. El valor recomendado es de 5 a 7.
    • brotli_static: Activa o desactiva la compresión para archivos estáticos.
    • brotli_types: Lista de tipos de archivo que utilizarán la compresión Brotli.
  6. Guarda el archivo y cierra el editor. Si usas nano, pulsa CTRL + X y confirma que quieres guardar el archivo. Un ejemplo de un archivo resultante podría ser el siguiente:
    load_module "modules/ngx_http_brotli_filter_module.so";
    load_module "modules/ngx_http_brotli_static_module.so";
    user nobody;
    worker_processes auto;
    #worker_rlimit_nofile 65535;
    error_log /var/log/nginx/error.log crit;
    pid /var/run/nginx.pid;
    
    events {
      worker_connections 1024;
      use epoll;
      multi_accept on;
    
    http {
      sendfile on;
      tcp_nopush on;
      tcp_nodelay on;
      client_header_timeout 3m;
      client_body_timeout 3m;
      client_max_body_size 256m;
      client_header_buffer_size 4k;
      client_body_buffer_size 256k;
      large_client_header_buffers 4 32k;
      send_timeout 3m;
      keepalive_timeout 60 60;
      reset_timedout_connection on;
      server_names_hash_max_size 1024;
      server_names_hash_bucket_size 1024;
      ignore_invalid_headers on;
      connection_pool_size 256;
      request_pool_size 4k;
      output_buffers 4 32k;
      postpone_output 1460;
    
      include mime.types;
      default_type application/octet-stream;
    
    # Compresion brotli 
      brotli on;
      brotli_comp_level 7;
      brotli_static on;
      brotli_types text/xml image/svg+xml application/x-font-ttf image/vnd.microsoft.icon application/x-font-opentype application/json font/eot application/vnd.ms-fontobject application/javascript font/otf application/xml application/xhtml+xml text/javascript application/x-javascript text/plain application/x-font-truetype application/xml+rss image/x-icon font/opentype text/css image/x-win-bitmap;
    
    # Compresion gzip
      gzip on;
      gzip_vary on;
      gzip_disable "MSIE [1-6]\.";
      gzip_proxied any;
      gzip_min_length 512;
      gzip_comp_level 6;
      gzip_buffers 8 64k;
      gzip_types text/plain text/xml text/css text/js application/x-javascript application/xml image/png image/x-icon image/gif image/jpeg image/svg+xml application/xml+rss text/javascript application/atom+xml application/javascript application/json application/x-font-ttf font/opentype;
    
    }
  7. Tras guardar el archivo anterior, debes reiniciar el servidor Nginx para que la configuración surta efecto:
    service nginx restart

    Si tu sistema utiliza SystemD, usa este comando en lugar del anterior:

    systemctl restart nginx
  8. Y con esto ya debería estar funcionando Brotli.

Cómo saber si Brotli está activado

Para comprobar si la compresión Brotli está activada, puedes comprobar las cabeceras de las peticiones HTTP, que deberían ser parecidas a las que se muestran a continuación:

HTTP/2.0 200 OK
server: nginx
date: Wed, 12 Jul 2019 20:06:12 GMT
content-type: text/html; charset=UTF-8
includeSubDomains; preload
content-encoding: br

Lo que nos interesa es la última línea. Es decir, que debes comprobar que el valor de content-encoding sea br. También puedes utilizar esta utilidad. Introduce la URL de tu web en el campo de búsqueda y comprueba el resultado:

Si Brotli está activado, verás un mensaje de éxito.


Avatar de Edu Lazaro

Edu Lázaro: Ingeniero técnico en informática, actualmente trabajo como desarrollador web y programador de videojuegos.

👋 Hola! Soy Edu, me encanta crear cosas y he redactado esta guía. Si te ha resultado útil, el mayor favor que me podrías hacer es el de compatirla en Twitter 😊

Si quieres conocer mis proyectos, sígueme en Twitter.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

“- Hey, Doc. No tenemos suficiente carretera para ir a 140/h km. - ¿Carretera? A donde vamos, no necesitaremos carreteras.”