Aceleración del Largest Contentful Paint (LCP) con la carga previa entre sitios
A partir de Chrome 103 para Android, Chrome lanzará gradualmente una función privada de proxy de carga previa para acelerar las navegaciones salientes desde la Búsqueda de Google y otros sitios web participantes en un 30% como promedio. Esta función privada de proxy de carga previa permite la carga previa del contenido de origen cruzado sin exponer la información del usuario al sitio web de destino hasta que el usuario navegue.
Continúa leyendo para obtener más información sobre cómo funciona esta función, cómo puede ayudar a mejorar significativamente la métrica Largest Contentful Paint (LCP) de tus sitios o cómo los sitios web de referencia pueden ayudar a los usuarios a lograr sus objetivos agilizando la navegación entre sitios.
Cómo funciona Private Prefetch Proxy
Canal de comunicación seguro
Esta función usa un proxy CONNECT
para establecer un canal de comunicación seguro entre Chrome y el servidor que aloja el contenido que se cargará previamente. Este canal de comunicación seguro evita que el proxy inspeccione las transferencias de datos. En particular, aunque Private Prefetch Proxy ve necesariamente el nombre del host para establecer un canal de comunicación seguro, no ve las URLs completas ni los recursos en sí.
![Animación que muestra el flujo de datos a través del proxy.](https://developer.chrome.com/static/blog/private-prefetch-proxy/images/prefetch.png?authuser=5&hl=es)
CONNECT
evita que se filtre información del usuario.Además, debido a que el canal de comunicación seguro está encriptado de extremo a extremo, los intermediarios no pueden observar los nombres de host ni el contenido de los sitios que se cargaron con anticipación. Por último, el proxy impide que el servidor de destino vea la dirección IP del usuario.
Evita la identificación del usuario
Más allá de los aspectos de red detallados anteriormente, también necesitamos evitar que los servidores identifiquen a un usuario en el momento de la carga previa, a través de la información almacenada previamente en su dispositivo. Con ese fin, actualmente Chrome restringe el uso de Private Prefetch Proxy a los sitios web para los que el usuario no tiene cookies o tiene otro estado local. Estas son las restricciones para las solicitudes de carga previa realizadas a través de Private Prefetch Proxy:
- Cookies: Las solicitudes de carga previa no pueden contener cookies.
- Si hay una cookie para un recurso, Chrome realizará una recuperación sin credenciales, pero no usará la respuesta (consulta la sección Almacenamiento en caché más adelante).
- Aunque las respuestas a una solicitud de carga previa pueden incluir cookies, estas solo se guardarán si el usuario navega a la página de carga previa.
- Huella digital: También se ajustan otras superficies que se podrían usar para la creación de huellas digitales. Por ejemplo, el encabezado
User-Agent
que envía el proxy de carga previa solo lleva información limitada.
En el futuro, esperamos expandir Private Prefetch Proxy a vínculos con cookies o estado local y, al mismo tiempo, mantener las mismas características de privacidad. Consulta la sección Próximos pasos para obtener más detalles.
Almacenamiento en caché
Chrome realizará una carga previa de los recursos incluso si ya se encuentran en la caché, pero no llevarán encabezados condicionales, como ETag
o If-Modified-Since
(estos contienen valores establecidos por el servidor que podrían usarse para el seguimiento, incluso sin cookies). Esta carga previa se realiza para evitar que se filtre el estado de caché de un cliente en el sitio web de carga previa. Además, Chrome solo confirmará en la caché un recurso que se haya cargado previamente si el usuario decide navegar al sitio web solicitado previamente.
Comienza a usar el proxy de carga previa privado
Para propietarios de sitios web
No es necesario que los propietarios de sitios web realicen ninguna acción para beneficiarse del proxy privado de carga previa en los vínculos para los que el usuario no tiene cookies ni estado local. De nuestros experimentos, esta es una oportunidad importante para la mayoría de los sitios web. Además, siempre es buena idea impresionar a los visitantes nuevos o poco frecuentes con una experiencia de carga muy rápida. En experimentos anteriores, notamos entre un 20% y un 30% de velocidad de Largest Contentful Paint en navegaciones cargadas previamente.
En el futuro, esperamos expandir esta función a los vínculos con cookies o estados locales y, al mismo tiempo, mantener sus características de privacidad. El desafío con las cookies es que pueden utilizarse para alterar la experiencia del usuario de maneras difíciles de predecir. Por lo tanto, lo más probable es que los propietarios de los sitios web deban aceptar o ajustar sus sitios para beneficiarse de Private Prefetch Proxy para los vínculos con cookies.
En concreto, si bien las solicitudes de carga previa no tendrán credenciales, la página web obtendrá acceso a las cookies y a otros estados locales cuando el usuario navegue hacia ella. Los desarrolladores podrían aprovechar esto para volver a agregar la personalización y los cambios basados en las cookies o el estado local. O tal vez, los desarrolladores también podrían estar interesados en declarar ciertos recursos como perfectamente adecuados para la carga previa y el uso sin modificaciones, sin cookies (es decir, recursos que no dependen de ninguna). Consulta la sección Próximos pasos para obtener más información y fundamentar nuestro plan.
Contenido o servicios basados en la ubicación geográfica
Si tu sitio web se comporta de manera diferente (por ejemplo, contenido diferente o acceso selectivo) en todos los mercados según la dirección IP del usuario, es posible que te preguntes cómo controlar las solicitudes de carga previa de Private Prefetch Proxy. Es importante saber que Private Prefetch Proxy funciona con varios servidores de todo el mundo y que la IP del proxy se ubicará geográficamente en el país desde el que el usuario inició la carga previa.
Por lo tanto, te recomendamos lo siguiente:
- Identifica las solicitudes de carga previa del proxy de carga previa privada mediante la presencia de un encabezado HTTP
Sec-Purpose: Prefetch; anonymous-client-ip
. - Busca la ubicación geográfica del Private Prefetch Proxy que emitió la solicitud mediante su dirección IP. Consulta este recurso para obtener una lista actualizada de las ubicaciones geográficas implementadas y las direcciones IP correspondientes.
- Entrega recursos de acuerdo con el mercado vinculado a esta ubicación geográfica en particular.
Control del tráfico
A partir de experimentos anteriores, sabemos que esta función suele generar menos del 2% de solicitudes adicionales de recursos principales (por ejemplo, documentos HTML). Dicho esto, si eres el tipo prudente, puedes usar el campo de fracción del aviso de tráfico para controlar cuánto tráfico debe permitir el proxy de carga previa privada. Puedes comenzar con una fracción pequeña, como 0.3 (es decir, 30%) y aumentarla gradualmente a 1.0 (es decir, 100%). Para ello, agrega el siguiente JSON a un archivo /.well-known/traffic-advice
, que debe entregarse con el tipo de MIME application/trafficadvice+json
:
[{
"user_agent": "prefetch-proxy",
"fraction": 0.3
}]
El campo fraction
es un número de punto flotante entre 0.0 (sin carga previa) y 1.0 (el 100% de las solicitudes de carga previa se procesan).
También es posible inhabilitarlo por completo con la siguiente configuración:
[{
"user_agent": "prefetch-proxy",
"disallow": true
}]
El proxy recupera el archivo /.well-known/traffic-advice
, no el cliente, y lo almacena en caché en el proxy según la semántica de caché HTTP habitual. Para obtener más flexibilidad, por ejemplo, un pico repentino de acceso pesado, puedes rechazar de forma temporal las solicitudes de carga previa (Sec-Purpose: prefetch;anonymous-client-ip
) con un código de estado 503 y configurar el encabezado Cache-Control: no-store
en la respuesta. También puedes agregar el encabezado Retry-After
para indicarle a Chrome cuánto tiempo debe esperar antes de reintentar las solicitudes de carga previa.
Para propietarios de sitios web de referencia
Si operas un sitio web con muchos vínculos a otros sitios web, es posible que te interese usar la función Private Prefetch Proxy para acelerar estas navegaciones de origen cruzado. Deberás agregar reglas de especulación a tus páginas para que Chrome sepa qué página crees que debe precargar a través de Private Prefetch Proxy. Aquí hay un ejemplo simple:
<script type="speculationrules">
{
"prefetch": [
"source": "list",
"urls": ["https://example.com/index.html"],
"requires": ["anonymous-client-ip-when-cross-origin"]
]
}
</script>
¿Qué sigue?
Este lanzamiento es solo el primer paso. Esperamos expandir y mejorar esta función en función de los intereses y los comentarios de la comunidad. Por ejemplo, nos gustaría recibir comentarios sobre cómo expandir los vínculos con cookies y estado local de manera que se minimice la fricción de los desarrolladores, o cómo hacer que esta función sea más útil para los sitios web de referencia.
Más información
- Precarga el proxy para los administradores de red.
- Explicación del aviso de tráfico
- Ideas interesantes sobre consejos de tráfico
- Repositorio de GitHub de WICG para esfuerzos relacionados con la especulación de navegación.
- Blog de Chromium en el que se introdujo originalmente el concepto del proxy de carga previa privada.