HTTP 103 Early Hints: How to diagnose if they are correctly set by Cloudflare and respected by Chrome?

Question

For my cryptocurrency market data website

• I have enabled early hints on Cloudlare

• I am generating early hints on SvelteKit/Vite web server hooks

• I have verified the presence of Link headers in the HTTP reply

Link: </fonts3.css>; rel="preconnect", </_app/assets/start-6f5e0715.css>; rel="preconnect", </_app/assets/pages/__layout.svelte-f31b19cc.css>; rel="preconnect", </_app/assets/pages/index.svelte-84a34be8.css>; rel="preconnect"

• I have enabled Chrome command line flag to respect early hints

Now, how do I verify that

• Cloudflare is correctly generating HTTP/1.1 103 Early Hints. Can I display this information with curl or wget?

• Chrome is respecting the early hint - where this is shown in the Performance tab of webr developer tools, or somewhere else?

Answer 1

I have no luck to verify Chrome's response from Chrome's devtool. When I monitor the network traffic, Chrome devtool does not show 103 responses at all. However, I am able to verify the server 103 responses using curl. Here is a curl output sample:

$ curl -k -v —http2 https://evanella.org

...

• Copying HTTP/2 data in stream buffer to connection buffer after upgrade: len=0
• Using Stream ID: 1 (easy handle 0x7fa7a2009200)

GET / HTTP/2 Host: evanella.org User-Agent: curl/7.64.1 Accept: /

...

• Connection state changed (MAX_CONCURRENT_STREAMS == 100)!

< HTTP/2 103

< link: https://evanella.org/; rel=preload;

< link: https://evanella.org/wp-content/themes/twentytwentytwo/assets/fonts/SourceSerif4Variable-Roman.ttf.woff2; rel=preload; as=font

< link: https://evanella.org/wp-content/themes/twentytwentytwo/assets/images/flight-path-on-transparent-d.png; rel=preload; as=image

< link: https://evanella.org/wp-content/themes/twentytwentytwo/style.css?ver=1.1; rel=preload; as=style

< link: https://evanella.org/wp-includes/blocks/navigation/view.min.js?ver=3776ea67846b3bb10fe8f7cdd486b0ba; rel=preload; as=script

...

< HTTP/2 200

< server: h2o/2.3.0-DEV@998a7fb7b

< content-type: text/html; charset=UTF-8

< link: https://evanella.org/wp-json/; rel="https://api.w.org/"

< vary: Accept-Encoding

BTW, I configured my own webserver to generate the 103 early hints responses.