HTTP/2 Server Push

This article describes a simple implementation of HTTP/2 Server Push.

Server push is a handy feature when it comes to loading your website faster by pushing the necessary resources to render a site. You have the option to decide which files should be pushed with a certain resource, anticipating what will your users access next.

To enable the Push feature, you'll need to modify the Link header accordingly. Here are some examples of the implementation:

Add the following header to a particular file to push “style.css” that’s in the “css” folder.

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

To push multiple files at once, you can add it like so:

Link: </css/style.css>; rel=preload; as=style, </js/http2-push.js>; rel=preload; as=script

Note that the file path is absolute, not relative (e.g. “../css/style.css”)

You can review a more in-depth description of Nginx HTTP/2 Server Push implementation here.