For some time now, articles about HTTP2 have been appearing on the web. It is the way forward, but I’m always wary of stepping on the bleeding edge. I usually wait until the dust has settled before implementing newer technologies.
According to caniuse, browser support for HTTP2 is looking pretty good. There are significant performance benefits from using HTTP2, as well as a number of design considerations. I won’t go into this here, as Smashing Magazine’s article covers this well.
I run a number of WordPress sites on a Media Temple Managed VPS (they used to call these DV). In another article I looked at Media Temple’s cheaper WordPress Hosting, but was less than impressed. However I’ve generally been pretty happy with the Managed VPS (aff link)- there’s enough support so that non-technical people like me can get by, and enough flexibility so that I can have a go at tweaking the server.
Plesk 12.5 and Centos 7
Recently MT offered a newer Managed VPS server configuration, running on Centos 7 and Plesk 12.5. This bought two major options:
- Can run PHP 7
- Can turn on HTTP2 for secure websites
PHP 7 is significant as it comes with built in caching and runs much faster. I can testify that my WordPress admin backend is noticeably faster now with PHP 7, and I had no problems setting it up.
Unfortunately I had no such joy with setting HTTP2 – but got there in the end.
NGINX and Plesk
For some time now NGINX has been a part of the Plesk / Centos offering. It runs out of the box on MT managed VPS. It acts as a reverse proxy allowing a backend performance increase, as the heavyweight Apache web server no longer has to handle everything itself (see more about this).
The trouble is when you want to start tinkering with NGINX settings. Much of the advice on the web tells you how to change configuration files, but if you are using Plesk, you will get yourself into trouble. Plesk is a point-and-click GUI, and generates almost all config files itself. I don’t know how many times I’ve read an article, implemented the changes, and had nothing happen.
I typically was adding changes to the wrong file, or Plesk was overwriting the changes.
Setting Up HTTP/2 on NGINX and Plesk
I have one WordPress site on the VPS server that is secure. The site sells a few products, so it was necessary to install an SSL cert. Going to HTTPS definitely seemed to slow the site down a bit. Most browsers have only implemented HTTP2 support for secure connections.
According to the Media Temple article, I only really needed to make one change. There was a pre-requisite that the NGINX version needed to be above 1.9.14. Fortunately Centos 7 comes bundled a newer version for this.
The MT article told me to alter the NGINX template and then reboot the server. This is wrong. However I only found this the hard way. The site was not using HTTP/2.
How to tell if your site is using HTTP/2
- Use the online tester at https://tools.keycdn.com/http2-test
- Open a new tab on Chrome and enter chrome://net-internals/#http2
- Or even easier: open Chrome Developer Tools, click the Network tab, right-click (Cmd-click) on the column headings and select Protocol.
This adds a new Protocol column that shows http/1.1 or h2 (for http/2)
After applying the MT recommendations, nothing happened, the site still served as HTTP/1. For starters the advice to reboot the server is overkill and unnecessary. You only need to restart NGINX from the SSH shell:
service nginx restart
There was also something else wrong with the article. Changes were made to this file /usr/local/psa/admin/conf/templates/custom/domain/nginxDomainVirtualHost.php and saved. But that’s not enough – this is a template NOT a configuration file, so the templates needed to be rebuilt.
Then I restarted NGINX, checked on the browser and voila – suddenly it was serving in HTTP2. All seemed good. It was 1030pm and I left it at that until the next morning.
Complete Failure on Firefox
Then I tried loading the site in Firefox (47.0 in this case). The weirdest thing happened – the site would start to load… and then nothing… no error. I checked in dev tools, and still nothing – just an attempt to retrieve the homepage and nothing else. Firefox supports HTTP2 so what’s going on.
I went to SSLLabs and did a test. Despite an A rating there was a funny error under the Firefox test.
Server negotiated HTTP/2 with blacklisted suite.
I then started digging into SSL ciphers and got very confused. So I pulled out the HTTP2 changes and left it for a day.
The Correct Way to Setup HTTP/2 on Plesk NGINX
I stumbled upon this glorious article at Plesk. It seems they have a script that sets up HTTP2.
I ran this and got an error “WARNING: You are using a custom virtual host template(/usr/local/psa/admin/conf/templates/custom/domain/nginxDomainVirtualHost.php)”
Because I had already altered this file (as per MT instructions) it must have compared timestamps or something, so I followed the troubleshooting advice here and manually made the changes.
I changed this
($OPT['default'] ? ' default_server' : '') . ($OPT['ssl'] ? ' ssl' : '') ?>;
($OPT['default'] ? ' default_server' : '') . ($OPT['ssl'] ? ' ssl' : '') . ($OPT['ssl'] && $VAR->domain->physicalHosting->proxySettings['nginxHttp2'] ? ' http2' : '') ?>;
Then did the http2_pref enable again.
A check back on chrome showed h2 now working… and incredibly it was working on Firefox also. A test at SSLLabs still returned an A grade, but with the noticeable absence of the Firefox errors.
Note to self: Follow the Plesk instructions. This implemented a different set of SSL ciphers than what was already there.
Is it worth it? Absolutely.
BEFORE – HTTP/1
AFTER – HTTP/2
The critical measurement here is DOMContentLoaded
Before (http/1) was 1.73s – after (http/2) was 1.01s
Note that I’m on the other side of the world to this server – there is always a 300-500ms latency based on my geographical location. If I was nice and close to the server, it would be a sub-second DOMContentLoaded time. Also note that this site loads google ads (which explains the long fully loaded times).
Hopefully this helps somebody somewhere.