What Does HTTP/2 Do?
If you’re not on HTTP/2, you’re likely using HTTP/1.1, which was released in 1999 when webpages were just a single HTML file. Nowadays, webpages make multiple requests for images, CSS, and JS, and while you should try to cut down as much as possible on extra requests, it isn’t feasible to set your tech back to 1999.
HTTP/1.1 has a problem though, in that it can only transfer one data stream per connection. This means every file is downloaded sequentially, regardless of the user’s internet speed, which can be a major slowdown, especially on large sites with many files.
HTTP/2 fixes this by allowing multiple requests to be downloaded in parallel over the same TCP connection, along with adding other features, such as header compression and the ability to push files directly to clients.
HTTP/3 is coming out soon, and rebuilds the transport layer to work over UDP rather than TCP, on a new protocol called QUIC. It’s in its early phases, but HTTP/2 is widely adopted already, powering 40% of the internet. You can enable it already if you haven’t yet done so.
Enabling HTTP/2 in Nginx and Apache
HTTP/2 support has been baked into Nginx and Apache for years now, but it’s not on by default, so you must turn it on manually.
One caveat of HTTP/2 is that you must serve HTTP/2 over a secure TLS connection, which means that you must have an SSL certificate installed and configured, and force the use of HTTPS everywhere. This isn’t an issue though, as you should already be doing this. If you haven’t done this yet, you can read our guide to setting up a free certificate from LetsEncrypt.
Nginx Configuration
For Nginx, verify that you are on version 1.9.5 or higher by running:
You probably are unless your server is horribly out of date; if it is, update your packages:
Next, open up the configuration file for your nginx site in your favorite text editor. It’s likely under /etc/nginx/sites-available/, either under your domain name or “default.” Change the lines that listen on port 443 to include the http2 directive:
You can check syntax with:
And restart nginx with:
After that, you should be all set.
Apache Configuration
You’ll have to enable the http2 module:
Then, inside your Virtual Host definition, add the Protocols directive:
h2 is HTTP/2, and HTTP/1.1 is used as a fallback for older browsers.
Restart Apache with:
And the changes should be saved.
Verifying the Changes
To check if your site is now actually using the HTTP/2 protocol, open up the Chrome DevTools by right-clicking anywhere and selecting “Inspect.” Head over to the “Network” tab, and right-click on the header of the info list to enable “Protocol”:
This will display the protocol for each request made. h2 is what you’re looking for:
Don’t worry if some external resources are still being served over HTTP/1.1. You’ll still see the speed benefits of HTTP/2, because requests to other servers are made over a separate connection. In the above output from howtogeek.com, some scripts for the Disqus comment system are still served over HTTP/1.1, which isn’t great on their part, but there’s not much you can do about it. On the other hand, Google is actually serving their fonts over QUIC already, if you’ve enabled the flag in Chrome.