Instant Fix WordPress Aproveche el almacenamiento en caché del navegador (paso a paso)
Publicado: 2021-07-08WordPress aprovecha el almacenamiento en caché del navegador (FIX fácil e instantáneo)
Tabla de contenido
Si desea comprender completamente cómo corregir el almacenamiento en caché del navegador en WordPress, quédese con nosotros hasta el final porque tenemos mucho que compartir.
¿A quién no le gusta tener una velocidad de carga ultrarrápida?
Pero de alguna manera descubrió que "aprovechar el almacenamiento en caché del navegador" impide que su sitio web se cargue rápidamente.
Sin embargo, estamos aquí para eso con una solución.
Este es el error más común que la mayoría de las personas encuentran en Google PageSpeed Insights.
Y si su objetivo es lograr puntajes superiores a 90 en Google PageSpeed Insights, entonces necesita arreglar esto.
Debe saber que la velocidad de la página es tan importante como siempre para obtener una clasificación alta en los SERP de Google, además de brindar una BUENA experiencia de usuario.
Esta publicación le dirá qué aprovecha WordPress del almacenamiento en caché del navegador y cómo solucionarlo.
Entonces, vamos a profundizar.
Poca información sobre aprovechar el almacenamiento en caché del navegador de WordPress
En pocas palabras, aprovechar el almacenamiento en caché del navegador acelera la carga de la página al reducir las solicitudes HTTP y mejorar el tiempo de respuesta del servidor.
AHORA, ¿qué entendemos por almacenamiento en caché?
La cantidad de tiempo que los navegadores almacenan los recursos almacenables en caché disponibles en un sitio web localmente se denomina almacenamiento en caché.
¿Qué está incluido en eso?
Esto incluye imágenes, CSS, JavaScript y otros.
Cuando alguien visita el sitio web, los recursos almacenables en caché que se han guardado en su dispositivo se vuelven a cargar.
La velocidad de carga del sitio web se mejora visiblemente. Esta es la razón por la que la gente quiere aprovechar el almacenamiento en caché del navegador en WordPress.
¿Qué es una plataforma genuina que muestra datos y soluciones reales?
Puede probar Think with Google para comprobar el estado de su sitio si se carga rápidamente o si tarda unos segundos en cargarse por completo.
Esta herramienta te dará todas las soluciones de cómo puedes optimizar tu sitio web para que cargue rápido, con un informe completo.
Otra herramienta legítima que puede usar es PageSpeed Insights de Google para probar la velocidad de la página de su sitio web.
Le recomendará que desarrolle una poderosa política de caché para aumentar la velocidad de la página.
Cómo aprovechar el almacenamiento en caché del navegador
Si posee u opera un sitio web, debe saber que el almacenamiento en caché del servidor se refiere al mecanismo a través del cual su sitio web produce páginas web en caché.
Esto es del lado del servidor; El almacenamiento en caché del navegador ocurre cuando los usuarios acceden al sitio web a través de su navegador.
Esto es exactamente lo contrario de la afirmación anterior.
Además, cuando utiliza el almacenamiento en caché del navegador, le está diciendo a su servidor cuánto tiempo deben almacenarse los recursos en los navegadores de sus visitantes.
Para aprovechar el almacenamiento en caché del navegador, normalmente deberá identificar los encabezados HTTP para especificar los tiempos de caducidad correctos para varios tipos de archivos en su sitio web.
Si desea ingresar el código manualmente o usar un complemento de WordPress, dependerá de si su servidor web es Nginx o Apache.
AHORA, pasemos a los métodos para aprovechar el almacenamiento en caché del navegador en WordPress, con y sin un complemento.
¿Cómo arreglar el almacenamiento en caché del navegador de apalancamiento en WordPress sin complemento?
Mucha gente no prefiere un complemento de WordPress para solucionar este problema.
Puede usar el almacenamiento en caché del navegador cambiando la configuración en su servidor web.
Su servidor web le indicará al navegador del visitante que guarde esos recursos en el caché del navegador si lo hace.
Estos archivos serán almacenados localmente por el navegador durante un período de tiempo determinado y se utilizarán para visitas posteriores a la página.
El procedimiento para indicarle a su servidor web que comience a almacenar en caché los navegadores de sus visitantes varía de un servidor a otro.
Apache y Nginx son los servidores web más populares.
Comencemos a corregir paso a paso el almacenamiento en caché del navegador en WordPress en ambos servidores.
1. WordPress aprovecha el almacenamiento en caché del navegador usando (Apache)
Muchos servicios de alojamiento compartido usan Apache, por lo que si su sitio tiene un archivo .htaccess, deberá seguir las instrucciones del código Apache.
Así es como puede usar código personalizado para aprovechar el almacenamiento en caché del navegador en su servidor Apache.
Una vez que haya confirmado que su servidor se ejecuta en Apache, puede continuar con el siguiente paso.
1. Para obtener acceso a su servidor, inicie sesión en CPanel o use un cliente FTP.
2. Encuentra tu archivo .htaccess ahora.
Debido a que el archivo .htaccess puede estar oculto de forma predeterminada, es posible que deba mostrar los archivos ocultos (dotfiles).
Su archivo .htaccess debería parecerse a la imagen de abajo.
Debe comprender que puede editarlo directamente en el servidor o importarlo y abrirlo en un editor de texto.
Además, tiene muchas opciones para determinar las reglas de almacenamiento en caché del navegador, como:
Encabezados de caducidad o encabezados de control de caché.
Veamos ambos.
1. Encabezados de control de caché:
Deberá agregar el siguiente fragmento de código en la parte superior de su archivo .htaccess después de abrirlo:
copia este código:
# BEGIN Encabezados de control de caché
<IfModule mod_expires.c>
<IfModule mod_headers.c>
<filesMatch “\.(ico|jpe?g|png|gif|swf)$”>
Encabezado agregar Cache-Control "público"
</filesMatch>
<filesMatch “\.(css)$”>
Encabezado agregar Cache-Control "público"
</filesMatch>
<filesMatch “\.(js)$”>
Encabezado agregar Cache-Control "privado"
</filesMatch>
<filesMatch “\.(x?html?|php)$”>
Encabezado agregar Cache-Control "privado, debe revalidar"
</filesMatch>
</IfModule>
</IfModule>
2. Caduca encabezados:
Estos encabezados Expire se pueden agregar a la parte superior de su archivo .htaccess, al igual que el encabezado Cache-Control.
Mira el formato del código:
## EXPIRA ALMACENAMIENTO EN CACHE ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg “acceso 1 año”
ExpiresByType image/jpeg “acceso 1 año”
ExpiresByType image/gif “acceso 1 año”
ExpiresByType image/png “acceso 1 año”
ExpiresByType text/css “acceso 1 mes”
ExpiresByType text/html “acceso 1 mes”
Aplicación ExpiresByType/pdf “acceso 1 mes”
ExpiresByType text/x-javascript "acceso 1 mes"
Aplicación ExpiresByType/x-shockwave-flash “acceso 1 mes”
ExpiresByType image/x-icon "acceso 1 año"
ExpiresDefault "acceso 1 mes"
</IfModule>
## EXPIRA ALMACENAMIENTO EN CACHE ##
Puede revisar fácilmente estos encabezados desde DevTools de Chrome una vez que los haya configurado en su servidor.
Simplemente vaya a la pestaña Red, seleccione un activo y busque el formulario de encabezado que agregó, como Cache-Control, Expires o ambos.
2. Deshabilitar etiquetas de entidad:
Por último, pero no menos importante, debe usar el siguiente código para desactivar las etiquetas de entidad:
FileETag Ninguno
Cuando deshabilita ETags, el navegador puede usar su política de caché en lugar de revalidar archivos cada vez que se carga una página.
Para que los cambios surtan efecto, guarde el archivo.htaccess y reinicie Apache.
WordPress aprovecha el almacenamiento en caché del navegador usando (Nginx)
Nginx es un servidor web gratuito y de código abierto que utilizan más de 500 millones de sitios web.
Tiene algunas opciones para configurar los tiempos de caducidad del almacenamiento en caché en los componentes estáticos y dinámicos de su sitio web, al igual que con Apache.
1. Encabezados de "Control de caché" (Nginx)
Dentro de su bloque de servidor, que normalmente se encuentra en
/etc/nginx/sitio habilitado/predeterminado,
añade este siguiente fragmento.
ubicación ~* \.(png|jpg|jpeg|gif)$ {
expira 365d;
add_header Cache-Control “público, sin transformación”;
}
ubicación ~* \.(js|css|pdf|html|swf)$ {
expira 30d;
add_header Cache-Control “público, sin transformación”;
}
2. Encabezados "Expires" (Nginx)
Inserte el siguiente código en su bloque de servidor que se encuentra en:
/etc/nginx/sitio-habilitado/predeterminado/
ubicación ~* \.(jpg|jpeg|gif|png)$ {
expira 365d;
}
ubicación ~* \.(pdf|css|html|js|swf)$ {
expira 30d;
}
¿Cómo arreglar el almacenamiento en caché del navegador de Aproveche en WordPress con el complemento?
En caso de que desee omitir los pasos de codificación más complicados, puede usar algunos de los buenos complementos de WordPress para aprovechar el almacenamiento en caché del navegador.
1. Caché más rápido de WP:
Caché más rápido de WP
WP Fastest Cache es otro complemento de almacenamiento en caché de WordPress con opciones de personalización sencillas.
Puede permitir el almacenamiento en caché del navegador en la edición gratuita. Como se muestra arriba, vaya a la página de configuración y marque la casilla de verificación de almacenamiento en caché del navegador.
2. Caché LiteSpeed:
Caché LiteSpeed
LiteSpeed Cache es un complemento de almacenamiento en caché que le permite aprovechar el almacenamiento en caché del navegador simplemente encendiéndolo.
Vaya a la configuración de caché después de haber instalado y habilitado el complemento. Vaya a la pestaña Navegador y active la función Caché del navegador.
También puede especificar una fecha de vencimiento.
Esta configuración, sin embargo, se aplicará a todos los archivos almacenados en caché en su sitio.
Conclusión:
El uso del almacenamiento en caché del navegador puede ayudarlo a mejorar su puntaje de prueba de rendimiento web.
Si ve esta advertencia en Google PageSpeed Insights, puede resolverla de la siguiente manera:
- Agregar encabezados Cache-Control o Expires.
- Aprovechar el almacenamiento en caché del navegador para Google Analytics.
- Minimizar el uso de scripts de terceros.
¿Tiene alguna otra sugerencia para resolver el problema de almacenamiento en caché del navegador de apalancamiento? ¡Por favor comparte tus pensamientos en la sección de comentarios!