Google PageSpeed dice que debería "Especificar una cabecera Vary: Accept-Encoding" para JS y CSS. ¿Cómo puedo hacer esto en el archivo .htaccess?
Supongo que se refiere a habilitar la compresión gzip para tus archivos css y js, porque eso permitirá al cliente recibir tanto contenido codificado con gzip como contenido sin formato.
Así es como se hace en apache2:
<IfModule mod_deflate.c> #La siguiente línea es suficiente para .js y .css AddOutputFilter DEFLATE js css #La siguiente línea también habilita la compresión por tipo de contenido de archivo, para la siguiente lista de tipos de contenido AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml #Las siguientes líneas son para evitar errores con algunos navegadores BrowserMatch ^Mozilla/4 gzip-only-text/html BrowserMatch ^Mozilla/4\.0[678] no-gzip BrowserMatch \bMSIE !no-gzip !gzip-only-text/html </IfModule>
Y así es como se agrega el encabezado Vary Accept-Encoding
: [src]
<IfModule mod_headers.c> <FilesMatch "\.(js|css|xml|gz)$"> Header append Vary: Accept-Encoding </FilesMatch> </IfModule>
El encabezado Vary:
indica que el contenido servido para esta URL variará según el valor de cierto encabezado de solicitud. Aquí dice que servirá un contenido diferente para los clientes que dicen Accept-Encoding: gzip, deflate
(un encabezado de solicitud), que el contenido servido a los clientes que no envían este encabezado. La principal ventaja de esto, según tengo entendido, es permitir que los proxies de almacenamiento en caché intermedios sepan que necesitan tener dos versiones diferentes de la misma URL debido a tal cambio.
Me temo que Aularon no proporcionó suficientes pasos para completar el proceso. Con un poco de prueba y error, pude habilitar con éxito la compresión Gzip en mi servidor WHM dedicado.
A continuación se muestran los pasos:
Ejecuta EasyApache dentro de WHM, selecciona Deflate dentro de la lista Exhaustive Options y reconstruye el servidor.
Una vez hecho esto, ve a Configuración de servicios >> Configuración de Apache >> Editor de Inclusiones >> Inclusión posterior al VirtualHost, selecciona Todas las versiones y luego pega el código mod_headers.c y mod_headers.c (listado arriba en la publicación de Aularon) uno encima del otro dentro del campo de entrada.
Una vez guardado, ¡estaba viendo un ahorro promedio de datos del 75.36%! Puedes realizar una prueba antes y después utilizando esta herramienta de compresión HTTP para ver tus propios resultados: http://www.whatsmyip.org/http_compression/
¡Espero que esto funcione para todos ustedes!
¡Para comprimir también tus archivos de fuentes!
añade "x-font/otf x-font/ttf x-font/eot"
como en:
AddOutputFilterByType DEFLATE text/html text/plain text/xml application/xml x-font/otf x-font/ttf x-font/eot
Esto me estaba volviendo loco, pero parece que la edición de aularon omitió los dos puntos después de "Vary"
. Así que cambiar "Vary Accept-Encoding"
por "Vary: Accept-Encoding"
solucionó el problema para mí.
Habría comentado debajo de la publicación, pero parece que no me deja.
En cualquier caso, espero que esto le ahorre a alguien el mismo problema que estaba teniendo.
Muchas horas gastadas en aclarar qué era eso. Por favor, lee esta publicación para obtener los códigos avanzados de .HTACCESS
y aprende lo que hacen.
Puedes usar:
Header append Vary "Accept-Encoding" #o Header set Vary "Accept-Encoding"
si alguien necesita esto para el archivo de configuración de NGINX
, aquí está el fragmento:
location ~* \.(js|css|xml|gz)$ { add_header Vary "Accept-Encoding"; (... otros encabezados o reglas ...) }
No es necesario especificar ni siquiera verificar si el archivo está o ha sido comprimido, puedes enviarlo a cada archivo, en cada solicitud.
Le indica a los proxys aguas abajo cómo emparejar futuros encabezados de solicitud para decidir si puede usar la respuesta en caché en lugar de solicitar una nueva al servidor de origen.
<ifModule mod_headers.c> Header unset Vary Header set Vary "Accept-Encoding, X-HTTP-Method-Override, X-Forwarded-For, Remote-Address, X-Real-IP, X-Forwarded-Proto, X-Forwarded-Host, X-Forwarded-Port, X-Forwarded-Server" </ifModule>
unset
es para solucionar algunos errores en el antiguo hosting de GoDaddy, opcionalmente.