Enabling Cloudflare HTTP/2 Server Push


#1

Cloudflare now supports HTTP/2 Server Push, but it needs a response header set.

I tried the following code, but it broke my site with a 500 error. What am I doing wrong?

<ifModule mod_headers.c> Header set Link: </wp-content/themes/sixteen-nine-pro/style.css>; rel=preload; </ifModule> [/code]


#2

I found I was able to add the following code to my WordPress functions.php and it works:

function add_vary_header($headers) {
    $headers['Link'] = '</wp-content/themes/sixteen-nine-pro/style.css>; rel=preload;';
    return $headers;
}
add_filter('wp_headers', 'add_vary_header');

I’d still like to find a .htaccess approach I can use on non-WordPress sites.


#3

I was wondering about this too. But it looks like support for http2 at DH is only available with nginx servers. And of course to access nginx config files as an admin user in order to set up the headers, you have to be upgraded on a dedicated server plan. Kind of bait and switchy if you ask me. What’s the point of changing to nginx on a dreamhost VPS for example for the performance gains if you can’t configure it as needed?


#4

You don’t need to run nginx at DreamHost for Cloudflare to use your push headers. An Apache server will still insert the push headers and Cloudflare will parse them and push the desired content.


#5

Ok, gotcha. Just out of curiosity, do you know how you would go about setting them up on nginx on a VPS if you didn’t have cloudflare then? (I do have cloudflare, just wondering.)


#6

HTTP2 with Push is built in to the nginx that’s available for VPS:


#7

I don’t understand. How would I actually set the resource I wanted to push? Where would I add that code in nginx?


#8

You add the code to your site, not nginx. Here’s how I started:


#9

It took me ages to work out just how to do this using PHP, and with Wordpress as the CMS. I ended up writing up some detailed step by step instructions, I hope it helps someone else too https://responsivedesign.is/articles/configuring-http2-push-wordpress/


#10

Thank you for sharing your instructions Javery!


#11

Thank a lot!