I'm trying to get a simple http/2 server push demo to work with the following simple hello world example:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Http 2 push demo</title>
<link rel="preload" href="core.css" as="style">
</head>
<body>
Hello World!
</body>
</html>
core.css
body {
font-size: larger;
font-weight: bold;
color: red;
}
In Chrome 66.0.x the css seems to be loaded successfully but I keep getting the following warning:
The resource http://localhost:8080/core.css was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it Please make sure it has an appropriate
as
value and it is preloaded intentionally.
and the css is not applied to the html body.
Am I missing something? Any ideas?
Preloading CSS files # Waiting for JavaScript to execute before loading non-critical CSS can cause delays in rendering when users scroll, so it's a good idea to use <link rel="preload"> to initiate the download sooner.
<link rel="preload"> tells the browser to download and cache a resource (like a script or a stylesheet) as soon as possible. It's helpful when you need that resource a few seconds after loading the page, and you want to speed it up. The browser doesn't do anything with the resource after downloading it.
If preloading is supported, the request for the image should be made before the JavaScript gets executed, i.e. you should see the request for the image immediately after the one for the HTML document is done.
The preload attribute specifies if and how the author thinks that the media file should be loaded when the page loads. The preload attribute allows the author to provide a hint to the browser about what he/she thinks will lead to the best user experience. This attribute may be ignored in some instances.
Right now you are only pre-loading the resource, but you are not using it in any way afterwards.
You still need a “normal” <link rel="styesheet" href="core.css">
to actually embed this stylesheet into the document and get it applied.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With