¿Cómo especificar la caché de mi navegador para mejorar el tiempo de carga de mi Web?
La optimización del tiempo de carga de nuestro sitio web es una variable más a tener en consideración a la hora de mejorar el posicionamiento orgánico de nuestro sitio web.
En post anteriores, ya hemos hablado de la importancia de optimizar el tiempo de carga de nuestra web, de cara a mejorar nuestro posicionamiento en buscadores. Ahora bien, la mejora de esta velocidad de cara de la web no depende en exclusiva de una única variable, son un conjunto de ellas, minimizar el tiempo de respuesta del servidor, minificar html, CSS, o gestión eficiente de los recursos de la web, además de priorizar la carga de dichos recursos y otro muchos más. Otro de estos muchas variables que pueden ayudarnos a mejorar la velocidad de carga de la web, es la correcta especificación de la caché del navegador.
Los navegadores gestionan llamadas al servidor del cual descargan toda la estructura de html de la página a la que se efectúa el llamamiento, y con toda esta estructura de html se descarga los recursos asociados al mismo, es decir, CSS, Javascript y todo aquel contenido media (fotos y vídeos), es decir todos aquellos recursos que dan estilo y forma a nuestra web. Ahora, cuando especificamos la caché del navegador, estamos diciendo al mismo, "recuerda esto que ahora estas viendo, para que cuando lo busquen de nuevo cada usuario, no tengas que hacer nuevamente todos los llamamientos al servidor y volver a cargar todas los recursos de la web"
De esta manera podremos reducir significativamente el número de peticiones HTTPS que el servidor tiene que procesar. Esta acción no va destinada al ahorro respecto al consumo de recursos, sino a la necesidad del volumen de procesamiento de los mismo cada vez que se requiera una nueva llamada al servidor. Esto permitirá a nuestro servidor responder con mayor brevedad a las solicitudes del navegador y por tanto reducir sustancialmente la velocidad de carga de la web.
¿Cómo especificar la caché de un navegador?
- Especificar caché para servidores apache
- Especificar la caché en servidor NGINX
Si arrancamos diciendo que tenemos que modificar nuestro archivo .htaccess añadiendo nuevas lineas de código que especifiquen el tiempo de espiración de caché, seguro que más de uno se verá intimidado. Pero fuera los miedos, es algo sencillo de llevar a cabo, tan sólo tenemos que seguir unos pocos pasos, y según nos enfrentemos a un servidor u otro consistirá en añadir unas filas u otras al archivo .htaccess.
Deberíamos, lo primero de todo, tener acceso al servidor donde esta alojado nuestra web, y desde allí, ahora sí, podemos proceder a la implementación de unas pocas líneas en el archivo .htaccess.
ExpiresActive On ExpiresByType image/jpg "access 1 year" ExpiresByType image/jpeg "access 1 year" ExpiresByType image/gif "access 1 year" ExpiresByType image/png "access 1 year" ExpiresByType text/css "access 1 month" ExpiresByType application/pdf "access 1 month" ExpiresByType text/x-javascript "access 1 month" ExpiresByType application/x-shockwave-flash "access 1 month" ExpiresByType image/x-icon "access 1 year" ExpiresDefault "access 2 days"
Estamos ante el mismo caso de un servidor apache, tan sólo, en este caso concreto las líneas a implementar en el bloque del servidor serán algo diferentes, pero la finalidad es la misma.
location ~* \.(jpg|jpeg|png|gif|ico)$ { expires 365d; } location ~* \.(css|js|pdf)$ { expires 30d; }
Tan sólo nos queda recordarte que estos tiempos especificados para días, meses incluso años, podríamos determinarlos en las medidas de tiempo que deseásemos y en los plazos que pudiésemos considerar oportunos, ahora bien, lo que os dejamos son los bloques temporales de caché más recomendados
Comentarios recientes