DIY: Optimización del Almacenamiento en Caché

DIY: Optimización del Almacenamiento en Caché pixelwork

DIY: Optimización del Almacenamiento en Caché

El almacenamiento en caché del navegador es la forma en que un navegador almacena archivos de tu sitio web en un equipo local. El almacenamiento en caché del navegador se asegura de la carga de todos los archivos sin necesidad de conexiones de servidor innecesarias, que es mucho más rápido. En este artículo, te diré cómo comprobar si la caché de navegador funciona y cómo optimizarla en WordPress.

¿Qué es la memoria caché del navegador?

La caché del navegador te permite omitir las conexiones del servidor y usar recursos desde tu computadora local. Funciona como los archivos temporales de Internet que ocupan mucho espacio en nuestro ordenador. Quieres que exista, ya que ayuda a acelerar las cosas, pero no quiere que existan siempre, ya que las cosas pueden cambiar en un sitio web. Puede establecer esta tasa de actualización para cualquiera que sea el tiempo de caducidad, cuanto más largo, mejor.

Lista de fechas de caducidad

En la mayoría de los casos, se pueden establecer tiempos de expiración en segundos. He aquí una lista de las posibles fechas de caducidad de la caché del navegador:

  • 3600 segundos (hora)
  • 86400 segundos (día)
  • 172800 segundos (dos días)
  • 604800 segundos (la semana)
  • 2592000 segundos (mes)
  • 31536000 segundos (año)

Google recomienda un tiempo mínimo de caché de una semana y preferentemente de hasta un año para sitios estáticos que cambian con poca frecuencia. Para la mayoría de los sitios, es cierto.

Sin embargo, el momento adecuado de caducidad depende en gran medida de la frecuencia de cambios de los contenidos. Si tienes un sitio de noticias, tu página de inicio cambia todo el tiempo.

Puedes ajustar el tiempo de caducidad para el contenido de tu página web (HTML) a 3600 segundos (1 hora) sin ningún problema. Sin embargo, si se carga un archivo CSS en esa página de inicio, que probablemente sólo cambes durante un rediseño. El tiempo de expiración de ese archivo CSS puede ser fácilmente 31536000 segundos (un año). Por favor, prueba y encuentra lo que mejor funciona para tu tipo de contenido.

Comprobación de la memoria caché del navegador

En esta sección, te mostraré un par de herramientas de velocidad de sitio utilizados para comprobar la memoria caché del navegador. La que uno desea utilizar para comprobar la memoria caché del navegador para su sitio web, depende de las preferencias personales.

YSlow


Mi favorito personal para el control de la memoria caché del navegador es YSlow de Yahoo. Está disponible como una extensión de navegador, funciona bastante rápido y comprueba mucho más que sólo los tiempos de expiración de la caché del navegador. Aquí hay una captura de pantalla:

ETags

Además de una simple verificación expiración de header, YSlow también te permite comprobar las etiquetas de entidad, que también se llaman ” ETags. Estos ETags se utilizan para “determinar si el componente en la caché del navegador coincide con el del servidor de origen.” Esto ayuda a determinar si un nuevo archivo está disponible. Ten en cuenta que ETags tiende a reducir la velocidad de un sitio web, así que por favor sumérgete en el tema y ve si realmente los necesitas.

Como se puede ver en la imagen, el primer archivo es un archivo CSS que tiene un tiempo de vencimiento de un día. No creo que sea necesario; en la mayoría de los casos, establecer los tiempos de caducidad de los archivos CSS a un año.

Google Insights PageSpeed


Google proporciona su propio verificador de almacenamiento en caché del navegador en PageSpeed ​​Insights. Si en la sección ‘Should fix’ contiene la recomendación ‘deliverar caché del navegador’, debes sin duda abordar esta cuestión.

Si estas herramientas no son lo suficientemente claras, hay más herramientas de las que dependemos para hacer chequeos adicionales, como Pingdom y GT Metrix.

Plugins de WordPress que ayudan a la memoria caché del navegador

El almacenamiento en caché del navegador es algo que se puede establecer, por ejemplo, en el archivo .htaccess. Para la mayoría de los usuarios, probablemente no es algo que se hace todos los días. Sin embargo, si estás utilizando WordPress, estás de suerte. Hay una serie de plugins que te pueden ayudar con esto. Hemos hecho una lista a continuación.

Rocket WP

WP Rocket es simple, combinado con una gran cantidad de opciones, hacen de este un plugin esencial para acelerar la optimización. El almacenamiento en caché del navegador está habilitado inmediatamente después de su activación. La caché móvil se puede activar también.

W3 Total Cache

Debido al laberinto de opciones de este plugin, he dejado de recomendar W3 Total Cache para el usuario medio de WordPress. Sin embargo, tiene opciones de almacenamiento en caché del navegador más específicos que la mayoría de los otros plugins.

En WordPress (con este plugin instalado), ve aa Rendimiento> Configurar encabezados de caducidad y habilítalos. Después de eso, ve a las secciones separadas para CSS / JS y HTML y elige  la expiración de tu sección específica.

Rocket WP es realmente mi primera recomendación. Pero si conoce bien la optimización de la velocidad, no dudes en revisar W3 Total Cache también.