WordPress and HTTP2: You should know that

In May 2015, HTTP / 2 was adopted as a new standard to replace HTTP / 1.1. The potential benefits of HTTP / 2 are enormous, but usability is not quite as easy as we thought. In this article, we’ll briefly look at the benefits this standard can offer site operators and the requirements for using WordPress and HTTP / 2 must be fulfilled.

How many articles have you read about WordPress and the speed of a website? If you like me, probably many. Also here I have Dr. med. Web already published some articles about it. An important part of a performance optimization is the server, without a reasonable, equipped with a modern operating system server, no optimization works.

That would be like fighting windmills. Since we are not all Don Quixote, we should not even start such things.

What is HTTP and what do you need it for?

Basically, HTTP (Hypertext Transfer Protocol) is one way a web server and a browser communicate with each other. So HTTP is the language in which servers and browsers communicate with each other.

I will not dive deep into the subject in this article, if you want to know more about it, check out the article on Wikipedia. For the first time, HTTP appeared in 1991 as version 0.9, so to speak in the law of the Internet.

Much has happened since then. In the past, the websites consisted of little more than a bit of background color, one or two graphics linked to the HTML and lots of text. The websites were only a few kilobytes big at the time, but today the websites are heavyweights, sometimes with a few MBs.

display

The development of the websites can be well observed using the example of Dr. med. Web.


One of the first versions of Dr. Web in the early days of the Internet.
One of the first versions of Dr. Web in the early days of the Internet.

Today, the actual number of files that together make up a website has risen dramatically. In the past only a few files had to be loaded, today there are dozens to load. This progress exacerbates the limitations of the old HTTP / 1 protocol. The result is an increased latency – or slowness of a modern website.

That in turn required the development of HTTP / 2. HTTP / 2 can be seen as an evolution of the old protocol, because the main goal was to reduce latency and thus increase the speed of loading with modern web browsers.

The limitation of HTTP / 1

Today, browsers need to load dozens, sometimes hundreds, of files to display a web site so that a web site can be displayed. The following is loaded for display:

  • The HTML of the website
  • The style sheets (CSS)
  • The JavaScript
  • The pictures
  • The videos
  • External files for Google Analytics, advertising and the like
  • Social sharing solutions

The big problem with HTTP / 1 is that the browser makes a request for every single file mentioned in the HTML, CSS and JavaScript. That could well be hundreds of inquiries and connections. Hundreds of HTTP requests have to be done, which can make a website pretty slow.

Speed optimization under HTTP / 1

From this limitation, a special concept was created how to make websites faster despite these limitations. Files were bundled to reduce queries, the size was reduced by compression, and graphics were combined into one sprite. HTTP / 2 should solve these problems and offer other ways.

The difference between HTTP / 1 and HTTP / 2

For the exact specification of HTTP / 2 please visit the HTTP / 2 GitHub FAQ. HTTP / 2 is designed to be read by machines and not by humans. Therefore, the new protocol is also binary because it optimizes the process of communication between the browser and the server.

It is also less error prone and can better interpret things like spaces, spaces, line endings, capitalization, and the like.

The big difference between the two protocols, however, are the connections. HTTP / 1 allows only a single connection at a time, but HTTP / 2 can handle multiple connections at the same time, because it works according to the multiplexing method.

  • HTTP / 1 must make a request for each file
  • HTTP / 1 loads one file after another
  • HTTP / 2, on the other hand, can load many files with one connection
  • HTTP / 2 allows multiple connections at the same time

The server push method of HTTP / 2

The server push process is a function in which the server actually knows which files the browser needs before actually requesting the files. The server then pushes the files to the browser without waiting for the browser to ask them. This makes the whole process of displaying a website much faster than before.

Further informationat Apache.org/Server Push

If you would like to experiment with the server push process, you will find a free WordPress plugin here. HTTP / 2 server push.

That’s why HTTP / 2 is much more efficient

  • It can generate the connection between the client and the server faster
  • The connection between browser and server is more efficient and thus faster
  • Files and resources are transferred simultaneously
  • Files can be pushed to the browser via server push
  • More files can be loaded and displayed at the same time

The online demo:the difference between HTTP / 1 and HTTP / 2

How can I use HTTP / 2 with my website?

Whether you can already use HTTP / 2 depends entirely on your web host. The new protocol is part of the server operating system (Apache, NGINX or ILS) and therefore needs to be maintained by your hoster.

If you have your own server, then you can upgrade to HTTP / 2 at any time and keep yourself up to date.

Of course, there are now some hosters who already support and offer HTTP / 2. But that seems to be an exception. You can even test whether your web server or hosting package already provides the new Turbo-HTTP. Use the online tool from KeyCDN:

HTTP / 2 test tool

How to use HTTP / 2 with your website

Theoretically, HTTP / 2 should be usable with any browser without special configurations. So far the theory. In practice, this looks quite different, unfortunately, because the major browser manufacturers have decided to provide support for the new protocol only via TLS (HTTPS). Here is a recent list of browsers that already support HTTP / 2:


Browser support for HTTP / 2. Green means that the protocol is supported.

So you need an SSL certificate for your domainbecause only with SSL encryption will you enjoy the high-speed protocol.

Test: Which website has HTTP / 2 already in use

Google Chrome has an extension that lets you see at a glance which site already has HTTP / 2 in daily use.

The extension sits next to the address bar of the browser and gives you feedback on the colors used, whether the protocol is used or not. A blue flash means that the website uses HTTP / 2 actively. Gray means that there is no support.


The blue flash stands for HTTP / 2 in daily use.
The blue flash stands for HTTP / 2 in daily use.

New ways to optimize speed

The old ways of speed optimization no longer work when using HTTP / 2, you would give away potential. However, the daily use of the protocol does not mean that no more files should be summarized, but only that it should be carefully considered, which files are not summarized.

The potential benefit of concurrently loading many resources can also lead to a slower website if all files are simply not pooled and compressed. JavaScript in a file compressed by – for example – to let autoptimize deliver results in a faster load time, because the file is loaded by optimized caching only once, if there is a corresponding. Htaccess file.

As optimal has proved after extremely many tests my way for advanced users to speed optimization. Here are the links to the series:

  • High Speed: Making WordPress Websites Really Fast – [# 1]
  • High Speed: Making WordPress Websites Really Fast – [# 2]
  • High Speed: Making WordPress Websites Really Fast – [# 3]
  • High Speed: Making WordPress Websites Really Fast – [# 4]
  • High Speed: Making WordPress Websites Really Fast – [# 5]

Conclusion

The use of HTTP / 2 is definitely worth it, even if you need to purchase an SSL certificate for the website. However, a free Let’s Encrypt certificate is also sufficient. The speed increase can be enormous, depending on the already existing concept for the speed optimization. However, with heavily trimmed sites whose servers are already using PHP 7, Speed’s growth is marginal despite splitting of files to load.

(Post Image:skylarvision / pixabay)