Browser caching y compresión gzip en Apache y Nginx
Actualización 2020-08-12: Paola Mesber escribe recomendando un sitio para verificar el estado gzip de un sitio que es más rápido que los otros dos que he vinculado, gracias Paola. Más información sobre la compresión al final del artículo.
Optimizando unos sitios Web para que luzcan bien en PageSpeed y WebPageTest.org(http://webpagetest.org/) me puse a hacer ciertas modificaciones. En Apache dentro de las directivas:
SetOutputFilter DEFLATE
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|ico|png)$ \ no-gzip dont-vary
SetEnvIfNoCase Request_URI \.(?:exe|t?gz|zip|bz2|sit|rar)$ \no-gzip dont-vary
SetEnvIfNoCase Request_URI \.pdf$ no-gzip dont-vary
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css A2592000
ExpiresByType text/richtext A3600
ExpiresByType image/svg+xml A3600
ExpiresByType text/plain A3600
ExpiresByType text/xsd A3600
ExpiresByType text/xsl A3600
ExpiresByType video/asf A2592000
ExpiresByType video/avi A2592000
ExpiresByType image/bmp A2592000
ExpiresByType application/java A2592000
ExpiresByType video/divx A2592000
ExpiresByType application/msword A2592000
ExpiresByType application/x-msdownload A2592000
ExpiresByType image/gif A2592000
ExpiresByType application/x-gzip A2592000
ExpiresByType image/x-icon A2592000
ExpiresByType image/jpeg A2592000
ExpiresByType image/jpg A2592000
ExpiresByType application/vnd.ms-access A2592000
ExpiresByType audio/midi A2592000
ExpiresByType video/quicktime A2592000
ExpiresByType audio/mpeg A2592000
ExpiresByType video/mp4 A2592000
ExpiresByType video/mpeg A2592000
ExpiresByType application/javascript A2592000
ExpiresByType application/x-javascript A2592000
ExpiresByType application/vnd.ms-project A2592000
ExpiresByType application/vnd.oasis.opendocument.database A2592000
ExpiresByType application/vnd.oasis.opendocument.chart A2592000
ExpiresByType application/vnd.oasis.opendocument.formula A2592000
ExpiresByType application/vnd.oasis.opendocument.graphics A2592000
ExpiresByType application/vnd.oasis.opendocument.presentation A2592000
ExpiresByType application/vnd.oasis.opendocument.spreadsheet A2592000
ExpiresByType application/vnd.oasis.opendocument.text A2592000
ExpiresByType audio/ogg A2592000
ExpiresByType application/pdf A2592000
ExpiresByType image/png A2592000
ExpiresByType application/vnd.ms-powerpoint A2592000
ExpiresByType audio/x-realaudio A2592000
ExpiresByType application/x-shockwave-flash A2592000
ExpiresByType application/x-tar A2592000
ExpiresByType image/tiff A2592000
ExpiresByType audio/wav A2592000
ExpiresByType audio/wma A2592000
ExpiresByType application/vnd.ms-write A2592000
ExpiresByType application/vnd.ms-excel A2592000
ExpiresByType application/zip A2592000
ExpiresDefault "access 1 month"
</IfModule>
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "max-age=2592000, public"
</FilesMatch>La primera parte es para activar la compresión gzip, la segunda parte para expirar contenido mayor a 30 días (2592000 segundos) desde que lo accedió el cliente y la tercera parte para configurar una fecha máxima para que estén en caché. Más información sobre mod_expires y mod_deflate en https://httpd.apache.org/docs/current/mod/
Y en Nginx en el bloque server colocamos:
location ~* \.(jpe?g|gif|ico|css|js|pdf)$ {
expires 30d;
}Con esto esos archivos expirarán luego de 30 días. Y en el bloque http:
gzip on;
gzip_disable "msie6";
gzip_vary on;
gzip_proxied no-cache no-store private expired auth;
gzip_comp_level 9;
gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript application/javascript;Y eso habilitará la compresión gzip. Más información de Gzip sobre Nginx en https://nginx.org/en/docs/http/ngx_http_gzip_module.html. Nginx es definitivamente más simple de configurar que Apache.
Más información
Este artículo habla sobre la compresión en gzip, pero hay otros como el que usa mi sitio que es Brotli (br). Se supone que este es más rápido que el gzip en sitios estáticos. En este sitio lo utilizo porque le tengo Cloudflare gratuito y ellos lo ofrecen, a mi en lo personal no me gusta porque es de Google.
Usando las herramientas de desarrollo de Firefox (F12) podemos buscar en los encabezados
Por cierto, usando las herramientas de desarrollo de Firefox (F12) tenemos una forma más de investigar si un sitio Web en específico soporta compresión. La desventaja en ésta forma es que si el sitio que estamos investigando es uno de esos sitios gordos nuestra propia conexión tendrá que lidiar con la transferencia de todos esos datos. Para eso es mejor una herramienta como la que Paola ha recomendado.
En lugar de gzip o br lo correcto sería buscar el encabezado content-encoding