2

He desarrollado una página web y la he probado en diferentes herramientas para comprobar su rendimiento y velocidad. En general, los resultados son buenos, pero hay una sección en la que todos me dan una nota más baja: "leverage browser caching" (o el aprovechamiento de la caché del navegador).

Mirando en Internet, encontré que puedo indicar el tiempo que quiero que se almacenen algunos elementos en la caché modificando el fichero .htaccess, al que añadí lo siguiente:

<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType image/svg "access plus 1 year"
ExpiresByType image/svg+xml "access plus 1 year"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresDefault "access plus 2 days"
</IfModule>

Con ello intento que la caché dure un año para imágenes e iconos, y 2 días por defecto para el resto de contenido. Vuelvo a realizar las pruebas y me vuelve a dar una mala nota para la sección de "leverage browser caching".

¿Qué es lo que estoy haciendo mal? ¿Cómo puedo aprovechar mejor la caché del navegador?

6
  • 1
    ¿Sólo para imágenes? ¿Y el resto? ... No sé si estás intentando tener una pregunta canónica sobre .htaccess o si realmente estás teniendo este problema y querés solucionarlo... Si es el segundo, quizás te conviene olvidarte del .htaccess y manejarlo a nivel de programación en el servidor (PHP?/asp.Net?), usando Last-Modified / ETags, comparando con la fecha real de modificación en el server, y devolviendo el HTTP/1.1 304 Not Modified como corresponde.
    – Mariano
    Commented el 24 nov. 2017 a las 10:51
  • Hola @Mariano, ¿qué diferencias efectivas existen entre hacerlo mediante htaccess y PHP/asp? Yo personalmente siempre lo he realizado mediante htaccess, ¿que inconvenientes tiene?
    – jonilgz
    Commented el 24 nov. 2017 a las 11:12
  • 1
    El tema son los navegadores (seguramente ya te imaginabas)... Debería repasar un poco cómo era el tema pero, a modo general, los navegadores (Chrome sobre todo) son desconfiados y, a pesar de tener el recurso en caché, y estar dentro del período del Expires, aún así solicitan el recurso al servidor. Es decir que hay muchos casos en los que no deberían consultar por el recurso, pero lo hacen... Y es ahí donde todo se desmadra... Te recomendaría ver la pestaña Network de Chrome para probar de dónde se están obteniendo.
    – Mariano
    Commented el 24 nov. 2017 a las 11:18
  • [cont.] ... Quizás hay forma desde el .htaccess de responder el 304 dependiendo de la fecha (también debería repasar este tema), pero las veces que lo intenté hacer, opté por olvidarme del .htaccess y hacerlo directamente en el lenguaje.
    – Mariano
    Commented el 24 nov. 2017 a las 11:20
  • 1
    Interesante, me lo apunto y este finde si saco algo de tiempo realizaré algunas pruebas, si no se adelanta nadie ya os comentaré como fueron.
    – jonilgz
    Commented el 24 nov. 2017 a las 12:30

1 respuesta 1

1

Las causas podrían ser diferentes, dependiendo de la herramienta que estés utilizando para comprobar esto.

Algunas de las que me vienen a la cabeza:

  • La herramienta aunque comprueba diferentes tipos, basa su resultado en ExpiresDefault, por lo que es demasiado bajo el tiempo que pones por defecto.
  • Al no aplicar directamente la cache a otros elementos importantes como html, css, js (la aplicas con ExpiresDefault) se aplica por muy poco tiempo, lo recomendado según Google es 1 semana y 1 año para elementos estáticos. Yo personalmente, dependiendo del tipo de aplicación y el tiempo de actualización, lo suelo poner todo a 1 año para webs comunes.
  • Existen elementos externos en tu web (cargados desde otro servidor) a los que no se les puede aplicar la cache. Ej. Google analytics, cdn´s que no lo tengan seteado de por si...

Como te comento, la herramienta puede estar basando su puntuación en alguna de las pautas que te indico. Muchas veces las herramientas luego hacen referencia a los elementos que están fallando, verifica esa opción para confirmar cual puede ser el problema. Lo más probable, es que el ExpiresDefault sea demasiado bajo.

Saludos,

1
  • Estoy haciendo las pruebas con GTMetrix, PageSpeed Insights y Pingdom (entre otros). Puse los JS y CSS en el htaccess de arriba (y no sólo las imágenes) y subió la nota consierablemente, pero sigue siendo la más baja por elementos externos como dices: Google Analytics, AdSense, etc.
    – Alvaro Montoro
    Commented el 24 nov. 2017 a las 18:39

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.