What Is HTTP/2 Server Push?

Cloudflare supports HTTP/2 Server Push via the Link header. To make use of Server Push, most applications will need to change their code to include a Link header with any requests that have pushable assets.

For example, if you have a web page called page.html that requires /css/style.css, you need to add the following header to page.html:

Link: </css/style.css>; rel=preload;

This tells our edge network to begin pushing /css/style.css every time a visitor asks for page.html. If style.css is already in the local browser cache, the browser will ignore the push and cancel the download. Otherwise, when it discovers /css/style.css while rendering the HTML, the browser will use the pushed asset instead of going back to the server. This removes an unnecessary round-trip that would have occurred without Server Push.

Server Push is a fundamental change to HTTP. Web servers used to only be able to respond to requests from clients, but now they can actively push out content to browsers. This opens the door to several new types of web optimization. Some of the most common use cases:

• Required Assets – The most obvious candidates for Server Push are all of the CSS, JavaScript, and image assets required by a web page.
• Uncacheable Assets – Pushing dynamic assets means that they’ll get to the browser that much faster, reducing perceived page load time.
• Likely Next Pages – By pushing the next page that a user is likely to load (e.g., the link they’re hovering over), Server Push can make it look like it loads instantaneously.
• Redirects – It’s also possible to push arbitrary redirects. This lets you control the user’s browser cache.