Andreas Hecht 31. August 2016

WordPress und HTTP2 – eine Einführung

WordPress und HTTP2 - eine Einführung

Im Mai 2015 wurde HTTP/2 als neuer Standard verabschiedet und soll in absehbarer Zeit HTTP/1.1 ablösen. Die möglichen Vorteile von HTTP/2 sind enorm, allerdings ist die Nutzbarkeit noch nicht ganz so einfach, wie angedacht. In diesem Artikel schauen wir kurz auf die Vorteile, die dieser Standard den Website-Besitzern bieten kann, und welche Voraussetzungen für eine Nutzung von WordPress und HTTP/2 erfüllt sein müssen.

WordPress und HTTP2 - eine Einführung

Wie viele Artikel hast du schon zum Thema WordPress und die Ladegeschwindigkeit einer Website gelesen? Wenn es dir wie mir geht, wahrscheinlich sehr viele. Auch ich habe hier auf Dr. Web schon einige Artikel dazu veröffentlicht. Ein wichtiger Teil einer Performance-Optimierung ist der Server, ohne einen vernünftigen, mit einem modernen Betriebssystem ausgestatteten Server funktioniert keine Optimierung.

Das wäre wie gegen Windmühlen kämpfen. Da wir alle nicht Don Quijote sind, sollten wir solche Dinge gar nicht erst anfangen.

Was ist HTTP und wofür braucht man es?

Grundsätzlich ist HTTP (Hypertext Transfer Protocol) ein Weg, wie ein Webserver und ein Browser miteinander kommunizieren. HTTP ist also die Sprache, in sich Server und Browser miteinander unterhalten.

Ich werde in diesem Artikel nicht tief in die Materie eintauchen, wenn du mehr darüber erfahren möchtest, schau dir den Artikel auf Wikipedia dazu an. Zum ersten Mal tauchte HTTP im Jahre 1991 als Version 0.9 auf, sozusagen in der Jura des Internets.

Viel ist seitdem geschehen. Früher bestanden die Websites nur aus wenig mehr als etwas Hintergrundfarbe, ein bis zwei Grafiken, die im HTML verlinkt waren und viel Text. Die Websites damals waren nur einige KB groß, heute sind die Websites dagegen Schwergewichte mit zum Teil einigen MBs.

Gut beobachten kann man die Entwicklung der Websites am Beispiel von Dr. Web.

Eine der ersten Versionen von Dr. Web in der Frühzeit des Internets.

Eine der ersten Versionen von Dr. Web in der Frühzeit des Internets.

Heute ist die tatsächliche Anzahl von Dateien, die zusammen eine Website bilden, sehr stark angestiegen. Früher waren nur einige wenige Dateien zu laden, heute sind es dutzende, die es zu laden gilt. Dieser Fortschritt verschärft die Einschränkungen, die das alte Protokoll HTTP/1 mit sich bringt. Das Resultat ist eine erhöhte Latenz – oder auch Langsamkeit einer modernen Website.

Das wiederum erforderte die Entwicklung von HTTP/2. HTTP/2 kann durchaus als Evolution des alten Protokolls angesehen werden, denn das Hauptziel war das Verringern der Latenz und damit eine erhöhte Ladegeschwindigkeit mit modernen Web-Browsern.

Die Limitierung von HTTP/1

Heute müssen die Browser zur Darstellung einer Website dutzende, manchmal sogar hunderte von Dateien laden, damit eine Website dargestellt werden kann. Folgendes wird zur Darstellung geladen:

  • Das HTML der Website
  • Die Stylesheets (CSS)
  • Das JavaScript
  • Die Bilder
  • Die Videos
  • Externe Dateien für Google Analytics, Werbung und ähnliches
  • Social-Sharing-Lösungen

Das große Problem bei HTTP/1 ist, dass der Browser für jede einzelne Datei, die im HTML, CSS und JavaScript erwähnt wird, eine Anfrage zu erstellen. Das können durchaus auch hunderte von Anfragen und Verbindungen sein. Hunderte von HTTP-Requests sind durchzuführen, was eine Website ganz schön langsam machen kann.

Speed-Optimierung unter HTTP/1

Aus dieser Limitierung heraus wurde ein spezielles Konzept erschaffen, wie man Websites trotz dieser Einschränkungen schneller machen konnte. Dateien wurden gebündelt, um Anfragen zu reduzieren, die Größe wurde durch Komprimierung reduziert und Grafiken zu einem Sprite zusammengefasst. HTTP/2 soll diese Probleme lösen und andere Wege anbieten.

Der Unterschied zwischen HTTP/1 und HTTP/2

Für die genaue Spezifikation von HTTP/2 besuche bitte das HTTP/2 GitHub FAQ. HTTP/2 wurde entwickelt, um von Maschinen und nicht von Menschen lesbar zu sein. Daher ist das neue Protokoll auch binär, denn das optimiert den Prozess der Kommunikation zwischen dem Browser und dem Server.

Es ist zudem weniger Fehleranfällig und kann Dinge wie Leerzeichen, Leerzeilen, Zeilenenden, Großschreibung und ähnliches besser interpretieren.

Der große Unterschied zwischen den beiden Protokollen sind jedoch die Verbindungen. HTTP/1 erlaubt nur eine einzige Verbindung zur Zeit, HTTP/2 kann jedoch mehrere Verbindungen gleichzeitig bearbeiten, da es nach dem Multiplexverfahren arbeitet.

  • HTTP/1 muss für jede einzelne Datei eine Anfrage stellen
  • HTTP/1 lädt eine Datei nach der anderen
  • HTTP/2 hingegen kann mit einer Verbindung viele Dateien laden
  • HTTP/2 erlaubt mehrere Verbindungen gleichzeitig

Das Server-Push Verfahren von HTTP/2

Das Server-Push-Verfahren ist eine Funktion, bei der der Server in der Tat weiß, welche Dateien der Browser benötigt, bevor dieser die Dateien tatsächlich anfragt. Der Server schiebt dann die Dateien an den Browser, ohne darauf zu warten, dass der Browser sie erbittet. Das gestaltet den gesamten Prozess der Anzeige einer Website wesentlich schneller als bisher.

Weitergehende Informationen unter Apache.org/Server Push

Wer mit dem Server-Push-Verfahren experimentieren möchte, findet hier ein kostenloses WordPress Plugin. HTTP/2 Server Push.

Darum ist HTTP/2 wesentlich effizienter

  • Es kann die Verbindung zwischen dem Client und dem Server schneller erzeugen
  • Die Verbindung zwischen Browser und Server ist effizienter und damit schneller
  • Dateien und Ressourcen werden gleichzeitig übertragen
  • Dateien können per Server-Push an den Browser geschoben werden
  • Es können mehr Dateien gleichzeitig geladen und angezeigt werden

Die Online-Demo: der Unterschied zwischen HTTP/1 und HTTP/2

Wie kann ich HTTP/2 mit meiner Website einsetzen?

Ob du HTTP/2 bereits nutzen kannst, hängt ganz und gar von deinem Webhoster ab. Das neue Protokoll ist ein Teil des Server-Betriebssystems (Apache, NGINX oder ILS) und muss daher von deinem Hoster eingepflegt werden.

Solltest du einen eigenen Server haben, dann kannst du jederzeit auf HTTP/2 upgraden und selbst für Aktualität sorgen.

Natürlich existieren mittlerweile einige Hoster, die bereits HTTP/2 unterstützen und anbieten. Doch das erscheint noch eine Ausnahme zu sein. Du kannst selbst testen, ob dein Webserver oder dein Hosting-Paket bereits das neue Turbo-HTTP zur Verfügung stellt. Nutze dafür das Online-Tool von KeyCDN:

HTTP/2 Test Tool

So nutzt du HTTP/2 mit deiner Website

Theoretisch sollte HTTP/2 mit jedem Browser ohne spezielle Konfigurationen nutzbar sein. Soweit die Theorie. In der Praxis schaut das leider ganz anders aus, denn die großen Browser-Hersteller haben sich dazu entschlossen, den Support für das neue Protokoll nur über TLS (HTTPS) zu ermöglichen. Hier eine aktuelle Liste von Browsern, die bereits HTTP/2 unterstützen:

Browser-Support für HTTP/2. Grün bedeutet, das das Protokoll unterstützt wird.

Browser-Support für HTTP/2. Grün bedeutet, das das Protokoll unterstützt wird.

Ein Klick öffnet die interaktive Liste auf Caniuse.com

Du benötigst also ein SSL-Zertifikat für deine Domain, denn nur mit einer SSL-Verschlüsselung wirst du in den Genuss des High-Speed Protokolls kommen.

Test: Welche Website hat HTTP/2 bereits im Einsatz

Für Google Chrome existiert eine Erweiterung, mit der du auf einen Blick sehen kannst, welche Website bereits HTTP/2 im täglichen Einsatz hat.

Die »HTTP/2 and SPDY indicator« Erweiterung

Die Erweiterung setzt sich neben die Adresszeile des Browsers und gibt dir anhand der verwendeten Farben Rückmeldung, ob das Protokoll eingesetzt wird oder nicht. Ein blauer Blitz bedeutet, das die Website HTTP/2 aktiv einsetzt. Grau hingegen heißt, das keine Unterstützung vorhanden ist.

Der blaue Blitz steht für HTTP/2 im täglichen Einsatz.

Der blaue Blitz steht für HTTP/2 im täglichen Einsatz.

Neue Wege gehen bei der Optimierung auf Speed

Die alten Wege der Speed-Optimierung funktionieren bei Einsatz von HTTP/2 nicht mehr, du würdest Potenzial verschenken. Der tägliche Einsatz des Protokolls heißt jedoch nicht, dass keine Dateien mehr zusammengefasst werden sollten, sondern nur, dass genau überlegt werden solle, welche Dateien nicht zusammengefasst werden.

Der mögliche Vorteil des gleichzeitigen Ladens vieler Ressourcen kann auch zu einer langsameren Website führen, wenn nun alle Dateien einfach nicht zusammengefasst und komprimiert werden. JavaScript in einer Datei komprimiert von – zum Beispiel – Autoptimize ausliefern zu lassen resultiert in einer schnelleren Ladezeit, weil die Datei durch optimiertes Caching nur einmal geladen wird, wenn eine entsprechende .htaccess-Datei vorliegt.

Als Optimal hat sich nach extrem vielen Tests mein Weg für fortgeschrittene User zur Speed-Optimierung erwiesen. Hier die Links zur Serie:

Fazit

Der Einsatz von HTTP/2 lohnt sich definitiv, auch wenn man ein SSL-Zertifikat für die Website erwerben muss. Ein kostenfreies Zertifikat von Let’s Encrypt ist jedoch auch völlig ausreichend. Der Geschwindigkeitszuwachs kann enorm sein, je nach bereits vorhandenem Konzept für die Geschwindigkeits-Optimierung. Bei stark auf Performance getrimmten Websites, deren Server bereits PHP7 einsetzen, ist der Zuwachs an Speed jedoch nur marginal, trotz Splitting von zu ladenden Dateien.

Andreas Hecht

Andreas Hecht

entwickelt WordPress-Websites und bietet dir einen Website Sicherheit Service und einen Performance Service für deine Website. Außerdem ist er Spezialist für Onpage SEO und bringt Deine Website in die Top-Suchergebnisse von Google. Auf seinem Blog schreibt er über WordPress, SEO und Content SEO.
Dr. Webs exklusiver Newsletter
Hinweise zum Datenschutz, also dem Einsatz von Double-Opt-In, der Protokollierung der Anmeldung, der Erfolgsmessung, dem Einsatz von MailChimp als Versanddienstleister und deinen Widerrufsrechten findest du in unseren Datenschutzhinweisen.

13 Kommentare

  1. Sehr schöner Artikel, was ich mich jedoch frage: Ihr schreibt ausführlich über http2 und nutzt es selber aber nicht! Wieso?

  2. Ich habe http2 auch für mich entdeckt und das dank Let’s Encrypt. Einige Hoster haben das sogar derart integriert, dass man nur einen Kopf drücken muss und schon ist das SSL aktiviert, ohne dass man sich damit auskennen muss. Ich denke, das ist die Zukunft, jetzt wo alles in Richtung SSL geht.

  3. Wie sieht das denn mit den Hostinganbietern aus? Bei 1und1 habe ich z.B. gerade gesehen, dass noch gar kein HTTP2 angeboten wird. Gibt es einen Grund für einen so großen Anbieter darauf zu verzichten?

  4. Ich bin mal gespannt, wie sich HTTP2 in der Praxis schlägt. Let’s Encrypt hat ja auch durchaus seine Kinderkrankheiten – http://www.spiegelfechter.com/wordpress/132589/kostenlose-sicherheit-drum-pruefe-was-sich-ewig-bindet

  5. Der Artikel ist recht gut, doch leider wird nicht alles behandelt. Die aktuelle Version von Chrome unterstützt nur noch Application-Layer Protocol Negotiation (ALPN) und nicht mehr Next Protocol Negotiation (NPN). Soweit kein Problem, leider wird ALPN erst ab der OpenSSL Version 1.0.2 unterstützt, da aber auf den meisten Servern und Hostingangeboten nicht die aktuellsten Linuxversionen laufen, fehlt diese. Somit heisst das, selber die Pakete bauen oder drauf verzichten.

  6. Hi Andreas,

    ich kann dem Thomas erstmal nur Recht geben :) Dank deinem Artikel verstehen auch Laien schnell und zuverlässig, was HTTP/2 zu leisten im Stande ist. Eine Anmerkung hätte ich aber noch: Du schreibst „Ein kostenfreies Zertifikat von Let’s Encrypt ist jedoch auch völlig ausreichend“. Ohne hier eine Diskussion über den Unterschied zwischen kostenpflichtigen und kostenlosen DV-Zertifikate vom Zaun brachen zu wollen, möchte ich ergänzen: Gerade die kostenlosen Zertifikate von Let’s Encrypt haben dafür gesorgt, dass auch solche Seitenbetreiber, die bisher kein Zertifikat hatten, jetzt nicht nur sehr einfach und schnell an kostenlose SSL-Zertifikate kommen, sondern damit eben auch von HTTP/2 profitieren können. Somit sind es gerade die Let’s Encrypt Zertifikate und deren Effekt auf den deutschen Hostingmarkt, die dafür sorgen, dass theoretisch ein Gros der Seitenbetreiber nun kostenfrei und einfach seine Seite optimieren kann :)

    Was ich an deinen Artikeln übrigens immer hervorragend finde: Du verkaufst keine absoluten Wahrheiten, sondern kontextualisierst stets! Sehr wichtig und sehr wertvoll für den Leser.

    Viele Grüße aus Münster,

    Jan von RAIDBOXES

  7. Hallo Herr Hecht,
    wie immer von Ihnen ein sehr informativer Artikel, vielen Dank! Was bekommen denn User von einer solchen Webseite zu sehen, deren Computer-Konfiguration bzw. deren Browser HTTP/2 nicht unterstützt? Z.B. nutzen in Deutschland laut caniuse noch 8% den IE11 …

    • Hallo,

      das ist kein Problem, denn der neue Standard ist abwärtskompatibel. Ein alter Browser zeigt die Website dann mit dem HTTP/1 Standard an. Die Ladezeit verlängert sich dann halt ein wenig.

      • Danke für die Info. Dann gibt es ja eigentlich gar keinen Grund, nicht sofort mit HTTP/2 zu arbeiten :-)

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Kennst du schon unseren Newsletter?

Hinweise zum Datenschutz, also dem Einsatz von Double-Opt-In, der Protokollierung der Anmeldung, der Erfolgsmessung, dem Einsatz von MailChimp als Versanddienstleister und deinen Widerrufsrechten findest du in unseren Datenschutzhinweisen.