Podemos optimizar el rendimiento de nuestra web usando el módulo mod_expires de Apache en nuestro htaccess para cachear el contenido y así ahorrarnos ancho de banda y que la web cargue más rápido.
Otros post interesantes de htaccess y de WPO son:
- Compresión GZIP: Ahorrar ancho de banda en tu web
- Habilitar la compresión Gzip en WordPress mediante htaccess
- DNS prefetch: Optimizar la carga de nuestra web resolviendo DNS previamente
- Lazy load de imágenes en HTML nativo sin necesidad de JavaScript
Sintaxis de mod_expires de Apache
Veamos la sintaxis extraída de su página web oficial:
1 2 3 4 5 |
<IfModule mod_expires.c> ExpiresActive on|off ExpiresDefault "access plus TIEMPO DE CACHE" ExpiresByType TIPO DE CONTENIDO "access plus TIEMPO DE CACHE" </IfModule> |
Como podéis apreciar la sintaxis es sencilla, vamos a repasarla:
- ExpiresActive: Por defecto su valor es off, con el valor ‘on’ activamos el módulo mod_expires.
- ExpiresDefault: Definimos el tiempo por defecto a cachear y que no haya sido cacheado con otra regla de ExpiresByType.
- ExpiresByType: Definimos el tipo de contenido con su cacheo propio.
Ejemplos de mod_expires de Apache para cachear contenido
Os pongo un código de ejemplo que os puede valer perfectamente para poner en el htaccess de vuestra web:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
<IfModule mod_expires.c> ExpiresActive on ExpiresDefault "access plus 1 week" ExpiresByType text/css "access plus 1 month" ExpiresByType application/json "access plus 0 seconds" ExpiresByType application/xml "access plus 0 seconds" ExpiresByType text/xml "access plus 0 seconds" ExpiresByType image/x-icon "access plus 1 week" ExpiresByType text/x-component "access plus 1 month" ExpiresByType text/html "access plus 0 seconds" ExpiresByType application/javascript "access plus 1 week" ExpiresByType application/x-web-app-manifest+json "access plus 0 seconds" ExpiresByType text/cache-manifest "access plus 0 seconds" ExpiresByType audio/ogg "access plus 1 month" ExpiresByType image/gif "access plus 1 month" ExpiresByType image/jpeg "access plus 1 month" ExpiresByType image/webp "access plus 1 month" ExpiresByType image/png "access plus 1 month" ExpiresByType video/mp4 "access plus 1 month" ExpiresByType video/ogg "access plus 1 month" ExpiresByType video/webm "access plus 1 month" ExpiresByType application/atom+xml "access plus 1 hour" ExpiresByType application/rss+xml "access plus 1 hour" ExpiresByType application/font-woff "access plus 1 month" ExpiresByType application/vnd.ms-fontobject "access plus 1 month" ExpiresByType application/x-font-ttf "access plus 1 month" ExpiresByType font/opentype "access plus 1 month" ExpiresByType image/svg+xml "access plus 1 month" </IfModule> |
Si os fijáis el contenido que suele variar fácilmente de valor lo he puesto con 0 segundos de chaché (no cachear), este contenido es XML, JSON y HTML.
Por otro lado, el contenido que podemos pensar que va a cambiar poco (estático) lo he puesto con tiempo de caché elevados, CSS, iconos, imágenes fuentes, vídeo y audio.