103 Early Hints: Un Código de Estado HTTP que Indica Pistas Tempranas en las Cabeceras

INDEX

Sobre el 103 Early Hints

Sobre el 103 Early Hints

Descripción General del 103 Early Hints

Precarga de Recursos EficienteCódigo de Estado HTTP
103 Early Hints Descripción El código 103 Early Hints es un código de estado HTTP que notifica a los clientes sobre recursos relacionados (como CSS y JavaScript) antes de proporcionar la respuesta final. Al usar este código, los navegadores pueden precargar recursos relevantes, mejorando significativamente la velocidad de carga de las páginas.
El servidor proporciona información anticipada sobre los recursos relacionados con la solicitud.
La precarga de recursos es un mecanismo para cargar previamente archivos importantes (como fuentes, imágenes y scripts) necesarios para una página web. Esto garantiza que los recursos estén listos cuando se necesiten, acelerando la carga de la página. Por ejemplo, se puede instruir al navegador para que “descargue esta fuente primero” y así lograr una visualización más fluida.

¿Cuándo se devuelve el 103 Early Hints?

Cuando el servidor necesita tiempo para generar la respuesta final
Cuando el navegador debe precargar recursos relacionados (como CSS, JavaScript, imágenes)
Para aprovechar la precarga de recursos y mejorar el rendimiento web

Ejemplos de 103 Early Hints

Notificación anticipada de recursos relacionados

GET /index.html HTTP/1.1  
Host: example.com

Ejemplo de respuesta:

HTTP/1.1 103 Early Hints  
Link: </style.css>; rel=preload; as=style  
Link: </script.js>; rel=preload; as=script  

HTTP/1.1 200 OK  
Content-Type: text/html; charset=UTF-8  

<html>
  <head>
    <link rel="stylesheet" href="/style.css">
  </head>
  <body>
    <script src="/script.js"></script>
  </body>
</html>

Explicación: El servidor devuelve el código 103 Early Hints, permitiendo que el cliente precargue recursos relacionados como CSS y JavaScript. Luego, se proporciona la respuesta habitual 200 OK con el contenido HTML.

Mejora de la velocidad de carga de la página

GET /homepage HTTP/1.1  
Host: example.com

Ejemplo de respuesta:

HTTP/1.1 103 Early Hints  
Link: </main.css>; rel=preload; as=style  
Link: </analytics.js>; rel=preload; as=script  

HTTP/1.1 200 OK  
Content-Type: text/html; charset=UTF-8  

[Contenido HTML de la página principal]

Explicación: Utilizando el código 103 Early Hints, el navegador puede descargar los recursos necesarios con antelación, mejorando la velocidad de carga de la página.

Aspectos a tener en cuenta

Puntos importantes al devolver el código 103 Early Hints:

Garantizar la precisión de la respuesta final
El código 103 Early Hints es un código de estado complementario, y la respuesta final (como 200 OK) debe proporcionarse correctamente.
Verificar la compatibilidad del cliente
No todos los navegadores o clientes admiten el código 103 Early Hints, por lo que se debe tener en cuenta la compatibilidad.

Comparación con códigos de estado HTTP relacionados

Explicación de los códigos de estado relacionados con el 103 Early Hints:

200 OK: Se utiliza cuando una solicitud se realiza con éxito y se proporciona una respuesta completa.
102 Processing: Indica que se está llevando a cabo un proceso prolongado, y tiene un propósito diferente al del 103.

Comprender estas diferencias ayuda a utilizar correctamente el código de estado 103.