Compresión Brotli y Gzip

La diferencia entre los algoritmos de compresión Brotli y Gzip para acelerar tu sitio web

¿Estás buscando formas gratuitas de hacer que tu sitio web sea más rápido? Una forma en que cada propietario de un sitio web pueda obtener un poco de velocidad gratis es activar la compresión en el servidor. Cuando tanto el servidor web como el navegador con el que está conversando entienden un algoritmo de compresión común, entonces los datos que realmente se envían por cable se pueden comprimir. Los datos comprimidos son más pequeños. Los datos más pequeños se reciben más rápido.

¿Qué es la compresión?

Cuando ingresas una URL en tu navegador, el navegador inicia una conversación con el servidor y una de las cosas que le dice es si puede descomprimir contenido y, de ser así, qué “algoritmos” de compresión comprende.

El servidor escucha, y si ha activado la compresión y conoce uno de los algoritmos de compresión que hace el navegador, comprimirá todos los datos y los enviará al navegador.

La mayoría de los navegadores web modernos entienden o “aceptan” contenido codificado en uno de tres algoritmos:

  • Deflate
  • Gzip
  • Brotli

Cuando un navegador web contacta a un servidor, envía un encabezado que se ve así:

Aceptar codificación: br, gzip

Eso le dice al servidor que entiende los datos comprimidos en Brotli (br) o Gzip (gzip). Los servidores tienen la opción de ignorar esto y devolver también datos sin comprimir.

Sin embargo, en general, los datos comprimidos viajan más rápido que los datos sin comprimir. Entonces, tu sitio web llega al navegador más rápido si los datos están comprimidos.

La compresión se aplica principalmente al texto:

  • HTML
  • javascript
  • CSS

Estos constituyen una gran parte de los sitios web modernos en estos días y todos estos pueden comprimirse mediante algoritmos de compresión por parte del servidor.

Por otro lado, tanto la mayoría de los formatos de imagen (jpg, png, etc.) como la mayoría de los formatos de audio (mp3) y otros archivos binarios que no son de texto ya están comprimidos. Comprimirlos no hará ninguna diferencia, por lo que, independientemente del encabezado de codificación de aceptación, los servidores los enviarán tal como están.

Como se indicó anteriormente, la mayoría de los navegadores web modernos aceptarán 3 algoritmos de compresión principales. La mayoría de los servidores ahora han migrado a uno o ambos de los dos más populares, Gzip y Brotli.

¿Qué es la compresión Gzip?

Los dos algoritmos de compresión más comunes son Gzip y Brotli. Gzip es el más antiguo y común de los dos. Fue escrito por Jean-loup Gailly y Mark Adler. La versión beta inicial se realizó en 1992. La primera versión real, la versión 1.0, se lanzó a principios de 1993. En 1992, justo cuando la web comenzaba a ser un concepto extendido para la mayoría de las personas.

Gzip fue diseñado como una biblioteca de compresión para todo uso. Las teorías detrás de Gzip se basaron en el algoritmo de compresión anterior, DEFLATE.

Debido a su popularidad, y al hecho de que es muy bueno para hacer archivos pequeños, todavía se usa ampliamente hoy en día tanto en diferentes sistemas operativos como en un algoritmo de compresión principal para servidores web.

¿Qué es la compresión de Brotli?

Brotli fue desarrollado por los empleados de Google Jyrki Alakuijala y Zoltán Szabadka en 2013. Originalmente, Google estaba buscando una mejor manera de comprimir archivos WOT que son fuentes web.

Gzip originalmente estaba destinado a comprimir archivos y se ha adaptado para comprimir transmisiones para que pueda funcionar en la web. Brotli, por otro lado, fue diseñado desde el principio para comprimir flujos. Esto lo convierte en una mejor opción para que los servidores web compriman el contenido antes de transmitirlo a un navegador.

En 2015, Google lanzó la especificación Brotli para HTTP. Además de especificar cómo el navegador debe notificar al servidor que puede descomprimir Brotli enviando un encabezado “Codificación de contenido: br”, los ingenieros de Google también realizaron otras mejoras en Brotli que lo hicieron aún más rápido para comprimir contenido web.

¿Cuál es la diferencia entre la compresión Brotli y Gzip?

Si bien ambos tienen su origen en el algoritmo LZ77, Gzip fue diseñado específicamente para comprimir archivos. La biblioteca se ha incorporado a muchos programas diferentes que necesitan comprimir archivos. La biblioteca se incorporó a los servidores web cuando la compresión de contenido comenzó a ser la norma. Era uno de los dos algoritmos de compresión especificados en RFC 2616, la especificación HTTPS 1.1. Si bien no fue diseñado específicamente para operaciones de transmisión como servidores web, se adaptó a ello.

Brotli, por otro lado, fue diseñado específicamente para la web. Google reconoció la necesidad de una forma de comprimir transmisiones de manera más eficiente, por lo que diseñó Brotli.

Ambos algoritmos hacen un buen trabajo para lo que fueron diseñados. Gzip todavía se sigue usando en la web porque es mejor que nada. Sin embargo, a medida que Brotli crece en popularidad, más y más servidores web prefieren Brotli a Gzip. Dada la elección de los dos, Brotli es el predeterminado que usarán muchos servidores. Ha sido la opción predeterminada en todos los servidores de SiteGround desde hace un tiempo.

¡Mira el siguiente video (en inglés) para obtener más información sobre las diferencias entre Brotli y Gzip!

Evaluación comparativa de Brotli y Gzip

Cuando se comparó Brotli con Gzip, se descubrió que comprime mejor los siguientes archivos:

  • JavaScript un 14% más pequeños
  • HTML un 21% más pequeños
  • CSS un 17% más pequeños

Dado que Brotli fue diseñado para comprimir transmisiones sobre la marcha, es más rápido tanto para comprimir contenido en el servidor como para descomprimirlo en el navegador que en gzip. En algunos casos, la descompresión inicial general es hasta un 64% más rápida que Gzip.

¿Cómo puedo habilitar la compresión en mi sitio web?

En términos simples, “activar la compresión” simplemente significa decirle a tu servidor web que comprima todo antes de enviarlo a un navegador que ha anunciado que puede manejar la compresión.

Si eres administrador de un servidor, sabes cómo editar archivos de configuración. Si no eres administrador del servidor, omita esta sección y desplácese directamente a la sección “Si no soy administrador del servidor” a continuación.

Si uso Apache

Si está utilizando el servidor web Apache, hay 2 pasos para habilitar la compresión Brotli:

  • En primer lugar, habilita el módulo apache Brotli. Se incluye de forma predeterminada, pero es posible que no esté habilitado:

$ sudo a2enmod brotli 

  • A continuación, debes editar el archivo de configuración de tu servidor web y decirle al servidor a qué desea aplicar la compresión:

<IfModule mod_brotli.c>

            AddOutputFilterByType BROTLI_COMPRESS text/html text/plain text/xml text/css text/javascript application/javascript

</IfModule>

En el ejemplo anterior, le estamos diciendo al servidor web que comprima:

  • HTML
  • Texto sin formato
  • CSS
  • JavaScript

Éstos son los principales tipos de archivos que se pueden comprimir.

Si uso Nginx

Nginx es otro servidor web muy popular. Al igual que Apache, está controlado por archivos de configuración. Debes ubicar tu archivo nginx.conf y agregar las siguientes dos líneas:

load_module modules/ngx_http_brotli_filter_module.so;

load_module modules/ngx_http_brotli_static_module.so;

Luego, en el archivo conf individual de tu sitio web, debes agregar lo siguiente:

brotli on;

brotli_static on;

brotli_types *;

Después de realizar los cambios, ya sea Apache o Nginx, reinicia tu servidor web y ahora responderá con un encabezado de “Codificación de contenido” si el navegador envía un encabezado de “Codificación de aceptación“.

Si no soy administrador del servidor

Si no eres administrador del servidor, en realidad es mucho más fácil para ti habilitar la compresión en tu servidor. Simplemente elige un hosting como SiteGround que lo activa de forma predeterminada. Es fácil.

La mayoría de los hostings de primer nivel como SiteGround están interesados ​​tanto en hacer que tu sitio sea lo más rápido posible como en conservar la mayor cantidad de ancho de banda posible. Éstos son los dos mayores beneficios de habilitar la compresión. Por lo tanto, los hostings de primer nivel activan la compresión de forma predeterminada.

Si no eres un cliente de SiteGround, debes asegurarte de que tu servidor web active la compresión en tu servidor web. Si no lo hacen y no la activan para ti, es hora de encontrar un nuevo hosting.

¿Cómo puedo probar la compresión de Brotli y Gzip?

Entonces, ¿cómo puedo saber si la compresión está activada para mi sitio web? Hay un par de maneras de hacer esto.

El camino difícil

  • Abre un navegador. Voy a usar Chrome en este ejemplo, pero el concepto funcionará con cualquier navegador. Sin embargo, los nombres de las opciones pueden cambiar un poco entre las marcas de los navegadores.
  • Haz clic derecho en cualquier parte del navegador y selecciona “Inspeccionar”
  • Esto abrirá una ventana en el lateral o en la parte inferior y es una ventana muy llena de datos. La ventana tiene varias pestañas con nombres como éste.
    • Elementos
    • Consola
    • Fuentes
    • Red
    • Rendimiento
    • Etc.
  • Busca la pestaña “Red”.
  • En el cuadro de URL de arriba, ingresa la URL de tu sitio web y presiona enter. Esto va a llenar la pestaña de red con muchos registros diferentes. Desplaza atrás hasta el primer registro. Debe ser simplemente el nombre de tu dominio.
  • Haz clic en ese primer registro.
  • Localiza el encabezado “aceptar codificación“. Se ubicará en la sección “Encabezados de solicitud“. Estos son los encabezados que tu navegador envió al servidor. Si no tienes este encabezado, intenta con un navegador diferente porque el servidor no se comprimirá si el navegador no envía el encabezado de compresión.
  • Finalmente, ubica el encabezado “codificación de contenido“. Esto se ubicará en la sección “Encabezados de respuesta“. Estos son los encabezados que tu servidor envió al navegador antes de enviar tu sitio web. Esto le dice al navegador que el servidor eligió Brotli como la compresión y debe descomprimir los flujos de contenido a medida que ingresan antes de mostrarlos.

Honestamente, la mayoría de los desarrolladores, incluido yo mismo, lo hacen de esta manera. Sí, para los no iniciados, este el camino difícil. Si normalmente no usas la pestaña Inspeccionar para profundizar en la conversación que tienen tu navegador y el servidor, entonces puede ser confuso. Sin embargo, una vez que comprendas qué buscar y dónde, esta forma requiere muy poco esfuerzo y está disponible en todas partes.

La manera fácil

Aún así, hay personas que no se sienten cómodas haciéndolo de esta manera. Para aquellos de vosotros que están leyendo este artículo y caen en esta categoría, os presento la manera fácil.

En serio, eso es todo. Al revisar mi sitio, obtuve los siguientes resultados.

Esto no solo me dice que mi servidor web es capaz de codificar mi sitio web en Brotli, sino que también me dice que el 80,66% de mi sitio web se encuentra encriptado.

Conclusión

La compresión en los sitios web ahora es la norma porque ayuda a que tu sitio se cargue más rápido.

Actualmente, Brotli es el mejor algoritmo de compresión disponible para sitios web. Si ves que no se te está ofreciendo Brotli, muévete a un proveedor de alojamiento web que lo tenga habilitado. ¡Un proveedor de alojamiento como SiteGround! Puedes obtener archivos más pequeños entre un 15 y un 20 % con Brotli, y los archivos más pequeños significan un sitio web que se carga más rápido. Obtenga más información sobre la implementación de SiteGround en nuestro artículo, Más velocidad del sitio con el algoritmo de compresión de Brotli. También puedes aprovechar todos nuestros otros aceleradores de velocidad que harán que tu sitio vuela.

Cal Evans

Evangelista PHP

Una de las personas más admiradas de la comunidad PHP, que ha dedicado más de 16 años a construir la increíble comunidad PHP y asesorar a la próxima generación de desarrolladores. Nos sentimos extremadamente honrados de que él también sea un amigo muy especial de SiteGround.

Iniciar discusión

Ha llegado el momento de practicar