Im Rahmen der praktischen Versuche dieser Arbeit wurden die Ansatzpunkte und Maßnahmen zur Verbesserung der Ladezeit von Webseiten aus Kapitel 3 angewendet. Dazu erfolgte eine Überarbeitung und Optimierung statischer Templates, die anschließend in die Content-Management-Systeme Contao, TYPO3 und WordPress integriert wurden. Dadurch konnte gewährleistet werden, dass die Vergleiche der Systeme stets unter den gleichen Grundvoraussetzungen erfolgten. Im weiteren Verlauf der Umsetzung wurden Lösungsansätze zur Performanceoptimierung für jedes CMS evaluiert. Darüber hinaus erfolgte die Betrachtung der Auswirkungen verschiedener Webserverumgebungen auf die Verarbeitungs- und Ladezeiten bei der Auslieferung der Websites.
Es zeigte sich in den Versuchen, dass die Verwendung eines Shared-Webhostings die Gesamtperformance der Content-Management-Systeme, durch eine Verlängerung der Verarbeitungszeit, negativ beeinträchtigte und aus Sicht der Performanceoptimierung nicht genutzt werden sollte. Das Nginx-Webhosting lieferte die beste Performance der Webserverumgebungen, während das SSD-Webhosting zwischen 0,1 bis 0,2 Sekunden länger zur Verarbeitung und Auslieferung der Webseiten benötigte. Die vorgegebenen Zielwerte des Performance Budgets konnten mit beiden Webserverumgebungen für die drei Content-Management-Systeme erreicht werden.
In der praktischen Umsetzung bestätigte sich die Aussage von Steve Souders, dass die Frontend-Templates das meiste Potential zur Optimierung der Ladezeit bieten [Sou07]. Die bisherigen Versuche erfolgten, zur Gewährleistung der Vergleichbarkeit, mit dem zu Beginn dieses Kapitels optimierten Template. Für ein abschließendes Fazit wurde ein Vergleich der Ursprungsversion des Template, welches WordPress als CMS nutzt, mit der optimierten Version der WordPress-Installation vorgenommen. Aus den Ergebnis-sen in Tabelle 4.28 geht hervor, dass die Gesamtladezeit bei dem Abruf der Startseite über einen Desktop-Rechner mit einem kabelgebundenen Datennetz um 70 Prozent reduziert wurde. Die HTTP-Anfragen konnten von 32 auf 14 und das Datenvolumen um 69 Prozent, von 921 Kilobyte auf 283 Kilobyte, verringert werden.
Tabelle 4.28: Startseite ausgeliefert durch WordPress beim Abruf über einen Desktop-Rechner
Metrik | Ursprungsversion | Optimiert | Verbesserung | |
Visually Complete | 2,1 Sekunden | 1,2 Sekunden | 0,9 Sekunden | 43 % |
SpeedIndex | 1708 | 692 | 1016 | 59 % |
Document Complete | 3,3 Sekunden | 1,0 Sekunden | 2,3 Sekunden | 70 % |
Time to First Byte | 0,7 Sekunden | 0,3 Sekunden | 0,4 Sekunden | 57 % |
Anfragen | 32 | 14 | 18 | 56 % |
Datenvolumen | 921 KB | 283 KB | 638 KB | 69 % |
Pagespeed Insights (Mobil / Desktop) | 56 / 71 | 100 / 93 | 44 / 22 | 79 % / 31 % |
YSLOW (Punkte / Note) | 70 / D | 94 / A | 24 | 34 % |
Pingdom | 74 | 99 | 25 | 34 % |
Bei dem Responsive Webdesign konnte durch die Auslieferung spezifischer Inhalte für mobile Endgeräte das Datenvolumen um 95 Prozent auf 56 Kilobyte reduziert werden (siehe Tabelle 4.29). Dies war einer der wesentlichen Faktoren zur Verbesserung der wahrgenommenen Ladezeit von 4,5 Sekunden auf 1,5 Sekunden in Abbildung 4.12.
Tabelle 4.29: Startseite ausgeliefert durch WordPress beim Abruf über ein 3G-Datennetz
Metrik | Ursprungsversion | Optimiert | Verbesserung | |
Visually Complete | 13,3 Sekunden | 1,6 Sekunden | 11,7 Sekunden | 88 % |
SpeedIndex | 4390 | 1310 | 3080 | 70 % |
Document Complete | 11,4 Sekunden | 2,6 Sekunden | 8,8 Sekunden | 77 % |
Time to First Byte | 1,3 | 1,1 | 0,2 | 15 % |
Anfragen | 45 | 6 | 39 | 87 % |
Datenvolumen | 1033 KB | 56 KB | 977 KB | 95 % |

Die Ursprungsversion des Template erfordert bei dem Abruf über ein mobiles Endgerät 13 weitere HTTP-Anfragen und die Übertragung eines zusätzlichen Datenvolumens von 112 Kilobyte, gegenüber dem Abruf durch einen Desktop-Rechner. Die Ergebnisse in den Tabellen 4.28 sowie 4.29 zeigen die Potentiale bei der Verwendung von Responsive Webdesign als ganzheitliche Lösung zur Optimierung der Darstellung und Auslieferung von Websites an mobile Endgeräte, unter der Berücksichtigung deren Limitierungen.
Bereits in der Planungsphase eines Webdesigns sollten die Auswirkungen von Design-entscheidungen auf die Ladezeiten einer Website, mit Hilfe von Performance Budgets, beachtet werden. Der Aufwand für eine nachträgliche Überarbeitung, beispielsweise durch den Wechsel des Ansatzes von einer Graceful Degradation hin zu Mobile First, erhöht den Entwicklungsaufwand und die damit verbundenen Kosten. In diesem Beispiel sind für die ausschließliche Überarbeitung des bestehenden, individuellen Templates 45 Arbeitsstunden angefallen.