Saturday, May 25, 2013
HAR-Storage und HTTP-Request-Tree: Fortgeschrittene Website-Performance Überwachung
von Gunter Bach (solute GmbH)
Saturday, 25.05.2013, New York II, 14:00-14:45 Uhr
Webseiten müssen schnell sein. Oft wird weit mehr Zeit auf Client-Seite verbrannt als auf dem Server. Neben den üblichen Verdächtigen, wie suboptimale Dateigrößen, schlechtes HTML/CSS-Design, zu viele HTTP-Requests und falscher Positionierung der Script-Elemente wird es inbesondere spannend, wenn Third-Party-Content-Provider auf der Seite eingebunden sind. Ob Werbebanner über Ad-Tags oder Widget-Integration ala Facebook – oft passiert mehr hinter den Kulissen, als man zunächst vermutet. In diesem Talk stelle ich zwei Tools vor, welche bei der Ursachenforschung von Performance-Problemen, zur regelmäßigen Überwachung der Performance und zur Dokumentation der Abhängigkeiten der einzelnen HTTP-Requests (HTTP-Request-Tree) helfen.
Um die Performance-Daten unseres Portals automatisiert zu dokumentieren wurde das Open-Source-Projekt HAR-Storage (http://code.google.com/p/harstorage/) um einige Features erweitert. Die Auswertungsoberfläche wurde modifiziert, damit sie mit einer größeren Anzahl von Messpunkten bedienbar bleibt. Zusätzlich kann man nun Screenshots zu den einzelnen Messpunkten speichern. Die Diagramme wurden um diverse zusätzliche Auswertungsmöglichkeiten erweitert. Ein Tool (harfetcher.py) zum automatisierten Hochladen von Auswertungen wurde hinzugefügt.
Wir verwenden das Tool inhouse, um regelmäßige Performance-Tests unseres Portals (billiger.de) mit möglichst detaillierten Informationen zu speichern. Diese dienen zum einen als Warnsystem bei Performance-Veränderungen, zum anderen unterstützen sie bei der Fehleranalyse. Neben der Vorstellung des Tools werde ich auch auf einige Auswertungsmöglichkeiten, welche HAR-Storage bietet, eingehen.
Das zweite Open-Source-Tool, welches komplett bei der solute GbmH entwickelt wurde, ist HTTP-Request-Tree (hrt). Dabei handelt es sich um ein Commandline-Tool – geschrieben in Python – welches einen kompletten HTML-Seitenaufbau (via phantomjs) durchführt und alle HTTP-Requests in Baumstruktur visualisiert (Rendering via graphviz). Diese Information ist für uns sehr wichtig, um die teilweise sehr verschachtelten Javascript-IFrame-Zählpixel-Verkettungen von Werbepartnern und Content-Providern aufzudecken und zu dokumentieren. Ich werde das Tool vorstellen, über mögliche Erweiterungen reden und auch auf die verschiedenen Lösungsansätze eingehen, welche letztendlich nicht zum Ziel geführt haben.
Durch den Einsatz beider Tools können wir dauerhaft die Performance-Kennzahlen unseres Portals im Auge behalten.
Links:
Über den Autor Gunter Bach:
Persönliche Angaben
Geburtsdatum und Ort:
12.10.1974 Saarbrücken
Familienstand:
verheiratet, 2 Kinder
Studium:
1995 - 2003
Studium der Informatik und Informationswissenschaft an der Universität des Saarlandes, Spezialisierung auf Programmiersprachen (Studium 2003 abgebrochen)
Beruflicher Werdegang:
Ab 1982:
Programmierung von diversen Kleinstprojekten auf ZX81, C64 und PC, darunter auch kleinere Auftragsarbeiten
1994 – 1995:
Programmierung PC-Spiel “Abaron” bei ProCon
1996 – 1999:
Studentische Hilfskraft bei SAP-Retail-Solutions in St. Ingbert.
1999 - 2010:
Leiter der Entwicklung bei kleinem IT-Unternehmen
2010 - 2012:
Leiter der Entwicklung bei Bach & Mailänder GmbH
seit Ende 2012:
Leiter Webtechnologies bei solute GmbH (billiger.de)