Debugging 103 early hints on Chrome

[Tomas Čerkasas]

Hey there!

I have a dummy website: https://websitevswebapp.com .
https://code103.hotmann.de/?url=https://websitevswebapp.com shows that image is being hinted for preload via 103 status.

There are few ways I'd love to debug if Chrome really "used this advice" whilst rendering page or not. I'm struggling with all of them for different reasons.

a) performance.getEntriesByName('https://websitevswebapp.com/static/dyno.jpg')[0].initiatorType - sometimes gives me `early-hints`, sometimes - `link`. Could someone shine a light why return values vary? If loading from browser cache - `link`, if loading from server - `early-hints`?

b) I can't find a way to see in a network waterfall diagram that the pre-load starts prior to the end of the initial response delivered. In https://blog.cloudflare.com/early-hints-performance/ there is a diagram https://blog.cloudflare.com/content/images/2022/06/image5-9.png where the effect of early hints can be seen clearly. How do I achieve such visual confirmation in chrome? If not visual, how could I deduct it from performance.getEntriesByName('https://websitevswebapp.com/static/dyno.jpg')[0] or any other means?

c) And lastly, how would I silence the warning `The resource https://websitevswebapp.com/static/dyno.jpg was preloaded using link preload in Early Hints but not used within a few seconds from the window's load event.` which is emited to console? (am using Chrome 107 beta)

Thanks a lot for any thoughts!