Skip to content

103 Early Hints

Description

The 103 Early Hints status code is an informational HTTP response status that allows a server to send preliminary HTTP headers to the client before the final response is ready. This enables the client to begin preparing for the final response while the server is still generating it.

This status code is particularly useful for optimizing web page loading performance. By providing early hints about resources that will be needed (such as CSS, JavaScript, fonts, or images), the client can begin preloading or establishing connections for these resources while the server is still preparing the main HTML response.

The 103 Early Hints status was introduced in RFC 8297 and is designed to work with the Link header to enable resource preloading and other performance optimizations.

Syntax

The server sends a 103 Early Hints status with preliminary headers:

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

[empty line]

The server will later send the final response with an appropriate status code (typically 200 OK).

Examples

Web Page Optimization Example

A client requests an HTML page that requires several resources:

Client Request: 

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

Server Early Hints Response: 

HTTP/1.1 103 Early Hints
Link: </styles/main.css>; rel=preload; as=style
Link: </scripts/app.js>; rel=preload; as=script
Link: </fonts/opensans.woff2>; rel=preload; as=font; crossorigin
Link: </images/hero.webp>; rel=preload; as=image

While the server continues processing, the client can begin downloading these resources.

Server Final Response: 

HTTP/1.1 200 OK
Content-Type: text/html
Content-Length: 5362
Link: </styles/main.css>; rel=stylesheet
Link: </scripts/app.js>; rel=script

<!DOCTYPE html>
<html>
<head>
  <title>Example Website</title>
  <link rel="stylesheet" href="/styles/main.css">
  <script src="/scripts/app.js" defer></script>
  <!-- ... more content ... -->
</head>
<body>
  <!-- ... page content ... -->
  <img src="/images/hero.webp" alt="Hero Image">
  <!-- ... more content ... -->
</body>
</html>

API Resource Preparation Example

A client requests data that requires significant processing:

Client Request: 

GET /api/dashboard-data HTTP/1.1
Host: api.example.com
Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...

Server Early Hints Response: 

HTTP/1.1 103 Early Hints
Link: </api/user-profile>; rel=prefetch
Link: </api/notifications>; rel=prefetch

The server suggests that the client might want to prefetch related resources.

Server Final Response: 

HTTP/1.1 200 OK
Content-Type: application/json
Content-Length: 1458

{
  "dashboardData": {
    "metrics": {
      "activeUsers": 12583,
      "conversionRate": 3.2,
      "averageSessionTime": 245
    },
    "recentActivity": [
      /* ... data ... */
    ],
    "relatedResources": {
      "userProfile": "/api/user-profile",
      "notifications": "/api/notifications"
    }
  }
}

Summary

The 103 Early Hints status code is a performance optimization mechanism that allows servers to send preliminary headers to clients before the final response is ready. This enables clients to begin preparing for the final response, such as preloading resources or establishing connections, which can significantly improve page load times and user experience. It's particularly valuable for complex web applications with multiple dependent resources or APIs that want to suggest related resources that might be needed soon.