Cómo activar la compresión Brotli en WordPress

Si estás comprometido con ofrecer una web rápida y optimizada, con las técnicas de WPO que te permitan entregar páginas rápidas y ahorrar recursos del servidor, el siguiente paso es la compresión Brotli en WordPress.

Así que vamos a ver qué es esto de la compresión Brotli y cómo usarla para acelerar WordPress.

¿Qué es eso de la compresión Brotli?

La compresión Brotli es un algoritmo de compresión de datos sin pérdida, de código abierto, desarrollado por Google bajo la licencia MIT.

Explicado técnicamente, comprime los datos usando una combinación de una variante del algoritmo LZ77, Huffman coding y modelado de contexto de segundo nivel.

Comparado con otros algoritmos actuales, su ratio de compresión es realmente bueno. Es similar en velocidad a deflate pero con una compresión mayor.

La compresión Brotli, además, es significativamente más rápida que otros tipos de algoritmos de compresión.

Es mucho más rápido que Zopfli, otro algoritmo de compresión que lanzó Google, y también ofrece una mejor y mayor compresión que Gzip, el popular algoritmo de compresión que utilizan la mayoría de servidores.

Usando la compresión Brotli podrás comprimir datos mejor que con cualquier otro algoritmo actualmente existente, ahorrando consumo de ancho de banda de tu servidor. De paso, todo irá más rápido para tus visitantes, también los móviles.

¿Cómo de buena es la compresión Brotli?

Según datos recopilados por Akamai, Brotli es un 20% más eficiente que Gzip. Y, aunque no te parezca mucho, en realidad es mucho mejor que el resto de algoritmos de compresión utilizados para comprimir HTML, JavaScript y CSS.

Al ser de código abierto, tú o tu proveedor de hosting podéis añadir Brotli a los sistemas existentes sin pagar nada por ello. Será bueno para tus visitantes y bueno para el consumo de ancho de banda del servidor.

En pruebas realizadas del rendimiento de Brotli en WordPress, con el tema TwentySeventeen y GZip y Brotli con la compresión a nivel 3, los resultados fueron esclarecedores.

WordPress con GzipWordPress con BrotliWordPress con Brotli + CDN
Velocidad de carga780 ms690 ms630 ms
Tamaño comprimido84.7 KB81.7 KB81.7 KB

Como puedes ver en la tabla anterior, en ambos casos la compresión Brotli resultó en tiempos de carga más rápidos y una compresión mayor que con Gzip.

Aunque la diferencia en tamaño de la página no es especialmente llamativa, ten en cuenta que estas pruebas se realizan en una instalación nueva de WordPress, sin imágenes, casi sin código ni textos.

En cuando una instalación crece en código y contenidos las pequeñas diferencias resultan en grandes ahorros y mejoras.

Además, recuerda que en esta prueba se establecieron los niveles de compresión al 3, si ponemos los niveles de compresión al máximo permitido por cada algoritmo los resultados cambian, aún más a favor de Brotli:

  • Brotli a nivel 11 – Tamaño comprimido: 67.7 KB
  • Gzip a nivel 9 – Tamaño comprimido: 76.7 KB

A estos niveles ya Brotli supera a Gzip en casi un 15% de compresión, de nuevo en una instalación nueva de WordPress.

Otra prueba, de carga de una misma URL con compresión Gzip y Brotli, arroja los siguientes resultados:

Como puedes comprobar las diferencias en el tiempo de carga (Load time), tiempo de conexión ( Connect Time) y tamaño de la página (Size in bytes) son abultadísimas, a favor de Brotli.

Si te gustan las comparativas, aquí tienes un análisis exhaustivo de cada nivel de compresión.

Y si quieres hacer una prueba de cómo comprimirían Gzip y Brotli tu sitio en este enlace tienes una herramienta para poner tu URL y comprobarlo.

En el caso de este blog la compresión Brotli empezaba a mostrar sus virtudes a partir del nivel 5 del algoritmo.

Pero vamos, que todos los grandes de Internet ya lo están aplicando, LinkedIn está consiguiendo mejoras superiores al 30% frente a Gzip y Zopfli.

¿Es Brotli compatible con mi navegador?

Muy buena pregunta, porque como es algo muy novedoso es mejor no llevarse sorpresas.

Como casi siempre, te recomiendo la maravillosa página de Can I Use, en este caso para comprobar la compatibilidad con Brotli.

Y, bien, los resultados muestran que sí en su mayoría, al menos los más modernos. Así que salvo que uses Internet Explorer, Opera Mini o IE Mobile tu navegador será compatible con la compresión Brotli.

Venga, abrevia, ¿qué ventajas tiene la compresión Brotli?

Pues apunta, que creo que son suficientes:

  • Mejoras de velocidad de carga de tu sitio.
  • Ahorro de ancho de banda de tu servidor.
  • Tu sitio será un algo más seguro, al ser un algoritmo más eficaz que los anteriores.
  • Te ganarás la confianza y el cariño de Google, por adoptar su nuevo algoritmo, algo nunca a desestimar.
  • Brotli se puede instalar en cualquier servidor, aún no fácilmente, pero se puede, es de código abierto.
  • Comprime y descomprime los datos más rápido que el resto de algoritmos.
  • Comprimir datos con Brotli utiliza menos recursos de la CPU (empresas de hosting ¿a qué esperáis para añadir Brotli a un clic?)
  • Ofrece un mejor ratio de compresión.
  • Brotli es significativamente más rápido que Gzip.
  • La mayoría de los principales navegadores son compatibles con la codificación de contenidos de Brotli.

¡Me vale! ¿Cómo añado Brotli a WordPress?

Amigo, tenemos un problema, y es que Brotli es algo tan novedoso que aún no lo tienen integrado la mayoría de las empresas de alojamiento, de hecho actualmente no sé de ninguna que lo incorpore de manera sencilla, con algún tipo de instalador y configurador, ni siquiera SiteGround.

Pero, como te he dicho antes, como es de código abierto lo puedes instalar tú mismo en tu servidor.

Pero tampoco es que sea algo fácil aún, solo tienes que ver la escueta lista de disponibilidad de Brotli:

  • Nginx – Google ha ofrecido un módulo Brotli
  • Apache – Google aún no ha publicado nada para Apache, pero hay uno no oficial.
  • Node.js – Puedes ver cómo usar Brotli aquí.

Vista la raquítica lista anterior, veremos cómo hacerlo con Ubuntu 16.04, la primera distribución de Ubuntu que permite instalar Brotli usando apt-get en tu servidor.

Para hacerlo solo tienes que lanzar:

$ apt-get update && apt install brotli

Una vez se complete la instalación tendrás que instalar el módulo Nginx para compresión Brotli y compilar la última versión de Nginx (actualmente la 1.15.5):

Con esto ya debería estar Brotli correctamente instalado en tu servidor.

Ahora tenemos que configurar el archivo de configuración de Nginx, nginx.conf, para especificar la configuración que queramos.

Las siguientes serían para aplicar el nivel 6 de compresión de Brotli a los principales tipos de archivo de código:

La lista completa de directivas que puedes aplicar la tienes en la  página del módulo de Nginx en Github.

Una vez hayas modificado el archivo nginx.conf ya solo queda recargar Nginx. Esto, como siempre, se hace con el comando systemctl reload nginx.

Pero aún no has terminado…

Resulta que si compruebas la carga de tu sitio verás que en sus cabeceras aún está funcionando la compresión Gzip.

Esto es debido a que el PHP de WordPress funciona con el ajuste zlib.output_compression = On.

Desafortunadamente, aún no hay ningún filtro de WordPress para cambiar esto, de momento.

Así que tenemos que desactivar manualmente zlib.output_compression editando el archivo php.ini (normalmente ubicado en /etc/php/7.0/fpm/php.ini si usas PHP 7.0).

Ábrelo para editarlo, desactiva la compresión Zlib con zlib.output_compression = Off y reinicia PHP usando systemctl restart php7.0-fpm.service.

Después ya comprobarás que tu web usa la compresión Brotli.

¡¡La hostia!! ¿No se puede hacer más fácil?

Ya te dije antes que de momento las empresas de hosting no han incluido instaladores, y que ni siquiera hay módulo oficial para Apache, solo para Nginx.

Pero bueno, sí, se puede, y te lo voy a contar, que para eso estamos, pero no lo vayas diciendo a todos por ahí.

El truco está en usar CloudFlare 🙂

Como ya te conté el otro día, resulta que hasta las cuentas gratuitas de CloudFlare tienen activa la compresión Brotli, así que si usas CloudFlare en tu WordPress ya tienes compresión Brotli por defecto ¿a que era fácil?

Por si no te acuerdas, solo tienes que ir a la sección llamada Speed del panel de CloudFlare y comprobar si está activa la compresión Brotli, como en la captura anterior.

Ahora mismo es el modo más sencillo de aplicar la compresión Brotli a WordPress.

No me fío ¿cómo sé que tengo Brotli activo y comprimiendo?

Así me gusta, con confianza, que yo escribo estos artículos porque me gusta engañar a la gente con más de 1000 palabras, el Twitter es para perdedores.

Pero bueno, como casi estamos terminando el artículo, te diré un par de métodos con los que comprobar si estás usando la compresión Brotli en tu WordPress … si la has activado de alguno de los métodos anteriores claro, sin trampas.

El primero y más rápido es visitar la página de comprobación de compresión Brotli y poner la URL de tu sitio ahí.

Si tienes activa la compresión Brotli la herramienta te mostrará un bonito resultado en verde, y podrás incluso compartirlo con tus followers.

En caso contrario te saldrá un resultado negativo, con el consiguiente lloro y lamentos por no haber seguido bien esta guía.

El otro método, por si tampoco te fías de analizadores online, es revisar las cabeceras HTTP de tu sitio.

Si tienes activa la compresión Brotli verás esto:

¿Qué dónde puedes comprobar esas cabeceras?, pues en herramientas como las Pingdom Tools o GTMetrix.

Muy bonito todo ¿pero se nota en algo la compresión Brotli en WordPress?

Sin ti no soy nada, que lo sepas 😀

En fin, pues sí, se nota, y no solo en pruebas de concepto como las que vimos arriba (¿las vistes no?) sino en sitios reales, aquí mismo sin ir mas lejos.

Aquí tienes los resultados de carga de este blog (sí, Ayuda WordPress) sin activar la compresión Brotli:

Y aquí ya con la compresión Brotli activa:

Lo mismo en mi página de servicios WordPress:

Se nota ¿no?

Para todo lo demás espero tus apreciaciones en los comentarios, ahí abajo ↓

Valora este artículo para mejorar la calidad del blog ...

Al hacer una valoración se recoge una cookie con la IP de tu dispositivo

FlojitoNo está malEstá bienMe ha servidoFantástico (13 votos, promedio: 4,62 de 5)
Cargando…

Autor: Fernando Tellado

Fernando Tellado, apasionado de WordPress, profesor, consultor y ponente. Maquero cansino, padre de tres hijos y de una perrita Beagle, Bilbaíno de nacimiento, Español de corazón y ciudadano de donde me quieran. Autor del libro WordPress - La tela de la araña. Mi blog personal es Navegando con red, donde he crecido como escritor en la red y ofrezco mis visiones acerca de la Web 2.0 y la blogosfera.

Comparte esta entrada en
468 ad

Centro de preferencias de privacidad

Cookies imprescindibles

Se usan para saber si ya aceptaste nuestras políticas, si ya estás suscrito a nuestra newsletter, para reconocer el estado de tu sesión si la tuvieses y para servir más rápidos los contenidos.

No se captura IPs ni siquiera para el servicio de Analytics así que tu visita es privada.

JSESSIONID, _cfuid, wpSGCachePypass, mailerlite, gdpr, gawp
mailerlite, _cfuid

Cookies de terceros

Usamos cookies de terceros con servicios, también garantes de tu privacidad, que analizan tus usos de navegación para que podamos mejorar los contenidos, si ya estás suscrito al boletín y los elementos compartidos en redes sociales y el formulario de comentarios.

1P_JAR, APISID, CONSENT, HPSID, NID, SAPISID, SID, SIDCC, SSID, disqus_unique, disqusauth
disqus_unique, disqusauth
1P_JAR, APISID, CONSENT, HPSID, NID, SAPISID, SID, SIDCC, SSID

Pin It on Pinterest

Share This