Cómo implementar el browser caching en WordPress

Si buscas una manera fácil y efectiva de implementar el Browser Caching, este artículo es para ti. Sin duda quieres mejorar el rendimiento y carga de tu sitio en Google PageSpeed Insights ó GTmatrix y estos medidores de velocidad y carga han sugerido que hagas algo para mejorar el Leverage Browser Caching. Siguiendo algunos pasos que se muestran a continuación, puedes tener resultados asombrosos en términos de velocidad de carga.

¿Cómo funciona el Browser Caching?

Empecemos por comprender como funciona el Leverage Browser Caching en WordPress y la manera en que ayuda en tener una carga más veloz de tu sitio. El navegador requiere utilizar recursos de un servidor (por ejemplo, HTML files, archivo CSS, archivo texto, imágenes etc.) El caché web es la tecnología utilizada por los navegadores y aplicaciones de software para almacenar temporalmente o «recordar» los recursos y páginas vistas en el disco local. Este almacenamiento temporal de información se conoce como «caché».

Y cuando tú visitas nuevamente el mismo sitio, el navegador sólo descargará el contenido actualizado y lo combinará con la información ya almacenada temporalmente. Esta es la manera como el caché reduce el uso de ancho de banda y la carga en el servidor. Es por eso que leverage browser caching resulta importante para que los sitios carguen más rápidamente.

Cómo funciona el leverage browser caching en WordPress

Para que el leverage browser caching funcione apropiadamente en WordPress, el servidor web debe permitir al navegador almacenar información del sitio web temporalmente o en el disco local. Esta es la manera en que se da una mejora considerable en la carga del sitio.

La pregunta siguiente es cómo habilito este caché, de qué manera mi servidor le permitirá al navegador almacenar el caché de un sitio determinado. Para habilitarlo, debes añadir encabezados de Cache-Control y ETag en los encabezados HTTP. El Cache-Control indica el período en que un archivo determinado estará en caché y Etag se utiliza para verificar cambios en recursos ya en caché y los recursos solicitados. Se puede especificar un periodo en meses o años para mantener en caché esos recursos

Hay dos maneras básicas de implementar el Leverage Browser Caching: la primera es añadir una pieza de código en el archivo .htaccess y la segunda opción es instalar un plugin que realice esta función.

Implementar Leverage Browser Caching en htaccess con servidor Apache

1. Requieres editar el archivo .htaccess que se encuentre en la instalación raíz de WordPress.

2. Abre el archivo .htaccess y pega el código siguiente:

# TN Expires Caching Start #
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css «access 1 month»
ExpiresByType text/html «access 1 month»
ExpiresByType image/gif «access 1 year»
ExpiresByType image/png «access 1 year»
ExpiresByType image/jpg «access 1 year»
ExpiresByType image/jpeg «access 1 year»
ExpiresByType image/x-icon «access 1 year»
ExpiresByType application/pdf «access 1 month»
ExpiresByType application/javascript «access 1 month»
ExpiresByType text/x-javascript «access 1 month»
ExpiresByType application/x-shockwave-flash «access 1 month»
ExpiresDefault «access 1 month»
</IfModule>
# TN Expires Caching End #

Es una buena práctica colocar la fecha en que expira en un año. Un valor igual o menor a un mes o mayor a un año no es recomendable.

Guarda el archivo .htaccess y limpia el caché de tu sitio WordPress en caso tengas un plugin de manejo de caché. Eso será todo.

Implementar Leverage Browser Caching utilizando un plugin

1. Te sugerimos que descargues el plugin WP Fastest Cache utilizando este enlace.

2. Instala el plugin y activalo.

3. Visita la configuración o settings de este plugin

4. Habilita la opción de Browser Caching y da click en el botón de Submit. Con eso será guardada tu elección.

Nuestra recomendación es que utilices el método directo de .htaccess, pero igualmente la versión en plugin te dará buen rendimiento.

Debes ver ya un mejor rendimiento de tu sitio.