¿Cuáles son los encabezados de control de caché HTTP?Una introducción a los usuarios de WordPress

¿Está confundido por qué está el encabezado HTTP para el control de caché y cómo funciona con su sitio de WordPress? En resumen, Cache-Control es un encabezado HTTP que especifica las políticas de almacenamiento del navegador para ciertos recursos estáticos en su sitio, como sus imágenes suenan un poco complicadas. Entonces, si nos soporta, investigaremos el tema del control de caché con muchos más detalles. En este artículo, explicaremos qué es el control de caché y cómo afecta el comportamiento en su sitio web. Pero antes de ingresar el encabezado de control de caché, primero debemos explicar el concepto de memoria en caché del navegador.
Esto es lo que cubriremos:
¿Cuál es la memoria en caché en el navegador?
¿Qué es el control de caché y cómo funciona (encabezados HTTP)
Diferentes directivas de control de memoria de caché
Cómo aplicar el control de caché a los usuarios de WordPress/WP Rocket
Penetamos … ¿Cuál es la memoria del navegador en el caché? Cuando alguien visita su sitio web por primera vez, su navegador web debe preguntar y descargar cada archivo para reproducir su página. Sin embargo, en las visitas posteriores, no tiene sentido obligarlos a solicitar y descargar cada recurso en cada visita. Por ejemplo, su logotipo probablemente cobre en cada página pero no cambia con tanta frecuencia. Forzar al navegador de un visitante para descargar su logotipo nuevamente para cada carga de página es solo un desperdicio de recursos que ralentizará su sitio.
El caché en el navegador le permite evitar este escenario guardando ciertos tipos de recursos en la computadora local. Luego, el navegador de un visitante puede cargar ese recurso local, en lugar de volver a descubrirlo, lo que acelerará el tiempo de carga de su sitio y creará una mejor experiencia para los visitantes. Es por eso que generalmente se ve “exploración de caché en el navegador” como una recomendación común en herramientas como Gtmetrix y Pingdom. Para activar la memoria de su navegador en caché, debe configurar su servidor web para decirle a los navegadores a los visitantes qué tipos de archivos almacenar y cuánto tiempo almacenarlos antes de volver a colocarlos. “Hey, almacene archivos JPEG para uno año, pero solo almacene archivos PNG durante un mes “. Básicamente, establezca datos de vencimiento de cuánto tiempo deben almacenar los contenidos de los visitantes. ¿Por qué agregar datos de vencimiento? Debido a que desea asegurarse de que sus visitantes aún reciban la última versión de su página estableciendo una fecha de vencimiento, se asegura de que los visitantes se vuelvan relevantes periódicamente para garantizar una experiencia actualizada. Para obtener más información, consulte nuestra publicación con explicaciones completas sobre la memoria del navegador.
Nota: la memoria del navegador en caché es una estrategia separada del almacenamiento de la página, de la que la mayoría de la gente habla cuando se refiere al “almacenamiento en caché” para WordPress. Si usa WP Rocket, WP Rocket implementará automáticamente tanto el almacenamiento de la página como el almacenamiento del navegador para usted, más sobre esto más adelante. ¿Qué es el control de caché, entonces? El control de caché es una de las principales formas de controlar este comportamiento de almacenamiento del navegador, el otro es los encabezados de vencimiento. Básicamente, el control de caché le permite establecer estos datos de “vencimiento” para controlar si el navegador de un visitante cargará un recurso de caché local o envía una solicitud al servidor web. Ofrece mucho control sobre cómo se comporta cada recurso individual y también permite Usted para controlar quién puede almacenar su contenido. Por ejemplo, puede decir que el navegador de un visitante puede almacenar una determinada imagen en caché, pero un CDN (como Cloudflating) no puede almacenarlo en caché. Específicamente, Cache-Control es un encabezado HTTP, que nos lleva a otro término que necesitamos definir. ¿Qué son los encabezados HTTP? HTTP, acortado para el protocolo de transferencia de hipertexto, rige cómo se comunican los clientes y los servidores. Para nuestros propósitos, un cliente es el navegador web de un visitante, y un servidor es el servidor de su sitio de WordPress.
Cuando un cliente necesita un archivo, envía una solicitud al servidor y el servidor envía una respuesta al cliente. Por ejemplo, si su sitio tiene una imagen, el navegador de un visitante primero solicitará esa imagen desde el servidor, y luego el servidor responderá con el archivo de imagen. El navegador repetirá el mismo proceso para cada recurso en su sitio, incluidas las hojas de estilo CSS, JavaScript, etc. Los encabezados HTTP permiten a los clientes o servidores enviar información adicional con esas solicitudes de clientes y respuestas del servidor. Existen diferentes tipos de encabezados HTTP, uno de ellos es control de caché. Los navegadores web más modernos incluyen desarrolladores para ver los encabezados HTTP asociados con cada solicitud/respuesta involucrada en la carga de una página web. En Chrome, puedes:
Herramientas de desarrollador abiertas (CTRL + Shift + I)
Ir a la pestaña de red
Recargar la página
Seleccione el recurso que desea analizar
Mira la pestaña del encabezado
Por ejemplo, aquí están todas las sedes de respuesta HTTP para cargar la imagen presentada para una de las publicaciones de blog WP Rocket:
HTTP Respuesta Antests en el sitio web de WP Rocket Puede ver que Cache-Control es uno de estos encabezados, pero hay muchos otros encabezados que comunican información adicional. Incluso agregué un lindo huevo de Pascua al encabezado X-Curious.
Los encabezados HTTP pueden ir en ambas direcciones. Es decir, su navegador web puede adjuntar los encabezados HTTP a la solicitud que realiza al servidor, y el servidor puede adjuntar los encabezados HTTP al navegador. Los encabezados HTTP consisten en pares clave valiosos. La “clave” es el lado izquierdo dos puntos, mientras que el “valor” es el lado derecho. Específicamente, el valor se llama Directiva de control de caché. En el ejemplo anterior, la clave es “Cache-Control”, y el valor/directiva es “max-gang = 31536000” (más sobre lo que esto significa). ¿Cómo funciona el control de caché? Ok, en este momento sabes lo que se debe almacenar la memoria del navegador. También sabe que el control de caché es una forma de controlar el comportamiento de almacenamiento del navegador y que el control de caché es un encabezado HTTP que se transmite cuando el navegador de un visitante se comunica con su servidor web. Veamos cómo funciona por el hecho del control de caché y Las diferentes directivas que puede usar para controlar el comportamiento de almacenamiento del navegador.
Como ha aprendido anteriormente, Cache-Control es un par clave valioso que se ve así: Cache-Control: Max-Ag = 31536000 En este ejemplo, la directiva es Max-Ag = 31536000, pero hay otras directivas de control de caché usted puede usar y también puede combinar más directivas usando comas. Pasemos por las directivas de control de memoria de caché más comunes. Cache-Control: Max-Age = La directiva máxima de la edad define siempre que un navegador pueda reutilizar el recurso tomado antes de descargar un nuevo recurso. El número de edad máxima está en segundos y comienza tan pronto como se realiza la solicitud.

Ejemplo: Cache-Control: Max-Age = 31536000 En este ejemplo, la Directiva le dice al navegador de un visitante que use el recurso almacenado en caché durante un año desde la hora de la solicitud inicial. Hay 31,536,000 segundos en un año. Muchas respuestas para el control de caché solo contendrán la directiva de edad máxima, por lo que puede pensarlo como la directiva “predeterminada”. El cliente y el servidor pueden utilizar la directiva máxima. Control de caché: público y control de caché: las directivas públicas y privadas privadas son dos directivas opuestas que controlan qué tipos de clientes pueden almacenar recursos. La directiva pública significa que el recurso puede ser almacenado por cualquier caché. Por ejemplo, el navegador de un visitante, un CDN, etc. La directiva privada, por otro lado, significa que el recurso aún se puede almacenar en el navegador del visitante, pero no puede almacenarse en caché por caché intermedio, como un CDN. Por lo general, utilizaría la Directiva Directiva Privada con información del usuario que no desea que sea almacenado en caché por un CDN, pero es bueno almacenarse en el navegador del visitante. Las directivas públicas y privadas son utilizadas solo por el servidor en su respuesta HTTP. Control de caché:
La Directiva S-Maxage S-Maxage es similar al máximo de edad, pero especialmente para caché compartido (como un CDN). Le permite controlar cuánto tiempo esos recursos compartidos pueden continuar sirviendo a un recurso de caché. Por ejemplo, si usa un CDN, esta sería una forma de controlar cuánto tiempo su CDN memoriza los recursos (siempre que su CDN respete la Directiva, que realiza los CDN más populares). El servidor solo usa la Directiva S-Maxage en su respuesta HTTP. Cache-Control: sin el caché sin caché, está algo confundido debido al nombre. Permite que cualquier caché almacene la respuesta, pero la respuesta almacenada debe pasar por la validación con el servidor de origen antes de usarla. Es decir, el navegador de un visitante debe verificar para asegurarse de que el recurso no haya cambiado antes de usar el recurso en caché. Si desea evitar completamente almacenar la respuesta en cualquier caché, realmente desea usar No-Store, que es la próxima directiva que analizaremos. El cliente y el servidor pueden utilizar la directiva sin cache. Cache-Control: sin la tienda de directiva sin almacenamiento, no permite que ambos navegadores y caché intermedio almacenen el recurso. El cliente siempre tendrá que solicitar este activo desde el servidor para cada carga de página. Por lo general, usaría esto para obtener información muy confidencial que nunca desea mantener en caché, como la información bancaria. El cliente y el servidor pueden utilizar la directiva sin tiendas. Cache-Control: Max-Stale [=
] A diferencia de las otras directivas que se pueden usar en la respuesta HTTP del servidor, la Directiva MAX-Stal se usa solo en la solicitud de un cliente al servidor.La Directiva Max-Stale le dice a un servidor que el cliente está dispuesto a aceptar una respuesta que haya excedido la nueva vida con la Directiva Max-Stale (en segundos) .WP Rocket y Cache-Control: ¿Tiene que hacer algo?

Si está utilizando WP Rocket para acelerar su sitio de WordPress, no tiene que preocuparse por los conceptos del encabezado de control de caché que hemos discutido en este artículo. WP Rocket implementa automáticamente la memoria del navegador en caché utilizando otro método popular: los encabezados caducan. WP Rocket permite el almacenamiento del navegador en caché (y el encabezado expira) de forma predeterminada, tan pronto como active el complemento. Establezca los tiempos de vencimiento óptimos para diferentes tipos de datos: puede ver la configuración exacta aquí. Por lo tanto, si usa WP Rocket en su sitio web de WordPress, no tiene que preocuparse por su caché o su sede de vencimiento, nos encargue de él tan pronto como active WP Rocket. También puede usar Cache -Control y los encabezados expiran al mismo tiempo; no debe haber conceptos que se excluyan entre sí. Si está utilizando WP Rocket, esto podría entrar en juego si usa un CDN para entregar algunos de sus activos estáticos. Muchos CDN le permiten definir su propia sede HTTP para el control de caché para los recursos que proporciona a través del CDN. Conclusión para terminar las cosas, para recapitular lo que cubrimos desde la perspectiva de un usuario de WordPress. Cache-Control es un encabezado HTTP que le permite controlar siempre que los navegadores de los visitantes (o CDN) deben memorizar diferentes tipos de recursos en su sitio memorizando estos recursos a nivel local, puede acelerar el tiempo de carga de su página del sitio.