Especificar caché de navegador

Si queremos aumentar el rendimiento de nuestra web y obtener una mejor nota en Pagespeed, uno de los requisitos es especificar la caché de navegador. Esto hará que nuestras imágenes, y archivos css y js tarden en caducar y por lo tanto se hagan menos consultas al servidor.

Para ello simplemente tendremos que añadir estas líneas a nuestro archivo .htaccess

Especificar la caché de navegador mediante ExpiresByType

Esta opción es menos recomendada y tiene prioridad la de Cache-Control

#especificar caché de navegador
 ExpiresActive On
 ExpiresDefault "access plus 10 days"
 ExpiresByType text/css "access plus 1 week"
 ExpiresByType text/plain "access plus 1 week"
 ExpiresByType image/gif "access plus 1 month"
 ExpiresByType image/png "access plus 1 month"
 ExpiresByType image/jpeg "access plus 1 month"
 ExpiresByType image/x-icon "access plus 3 months"
 ExpiresByType application/x-javascript "access plus 1 month"
 ExpiresByType application/javascript "access plus 1 week"
 ExpiresByType text/javascript "access plus 1 week"
 ExpiresByType application/x-icon "access plus 3 months"

 # FIN especificar caché de navegador

Especificar la caché de navegador mediante Cache-Control

<IfModule mod_headers.c>
    <FilesMatch "\.(css|js|json)$">
        Header set Cache-Control "max-age=3600, public"
    </FilesMatch>

    <FilesMatch "\.(jpg|jpeg|png|gif|webp|ico|woff|woff2|ttf|eot|svg)$">
        Header set Cache-Control "max-age=2592000, public, immutable"
    </FilesMatch>
</IfModule>