Nico Steiner - Frontend-Entwicklung und -Architektur

Sonntag, 31. August 2008

Performance-Analyse - Teil 2

Laut Steve Sounders besteht ein direkter Zusammenhang zwischen dem Seitengewicht (rote Linie) und der YSlow-Wertung (blaue Linie). Um diese besser vergleichen zu können, wurde die YSlow-Wertung invertiert. Die Grafik kann so interpretiert werden, daß eine Seite besonders gut optimiert wurde, wenn das Verhältnis von Seitengewicht zu inverser YSlow-Wertung besonders hoch ist, daß heißt je näher sich die rote Linie an der blauen befindet (oder sogar darüber). Das Ergebnis täuscht dabei vor, daß die Telekom besonders gute Arbeit geleistet hat, was jedoch nur daher rühert, daß die Telekom-Seite eine unglaubliche Seitengröße besitzt, die Skalierung des YSlow-Wertes jedoch auf dem Durchschnitt aller Seitengewichte basiert.

Geschrieben von Nico Steiner in Referenzen um 23:27 | Kommentare (0) | Trackbacks (0)

Performance-Analyse - Teil 1

Hier geht es zu der Statistik
Die erste Analyse soll einen Überblick über die wichtigsten Performance-Kriterien bei den DSL-Homepages der größten deutschen DSL-Provider geben. Wie diese Kriterien gedeutet werden können, kann man entweder in Steve Sounders Buch oder auf der Website von Yahoo! nachlesen.
Generell kann ich nach diesem ersten Überblick sagen, daß bei allen Providern enorme Potenziale im Bereich der Performance-Optimierung schlummern. Keiner der untersuchten Provider kam über ein "D" ("A" wäre optimal) beim YSlow Performane Grade hinaus - gerade 2 haben das "D" erreicht, die restlichen 6 Provider haben lediglich die schlechteste Bewertung "F" bekommen.

Geschrieben von Nico Steiner in Referenzen um 22:49 | Kommentare (0) | Trackbacks (0)

High Performance Websites

Das Buch High Performance Websites von Steve Souders (ehemals Frontend Engineer bei Yahoo!) beschreibt anhand von 14 Regeln in 14 Kapiteln die Maßnahmen, die zur Performance-Optimierung von Webseiten zu beachten sind. Laut Steve fallen 80-90% der Ladezeit einer Webseite in den Bereich des Frontends. Bei Befolgung seiner Regeln ist selbst bei ohnehin schnellen Webseiten eine weitere Steigerung um 50% möglich. Dabei stellt er fest, daß die Vermeidung von unnötigen HTTP-Requests die wichtigste der empfohlenen Regeln ist. Darüber hinaus gibt es 13 weitere wichtige Regeln, welche allesamt mit soliden Hintergrundinformationen und starkem Praxisbezug versehen sind. Komplettiert wird das Buch durch zwei einführende Kapiteln zur Erläuterung der Wichtigkeit von Frontend-Performance und den Grundlagen zum HTTP-Protokoll und einer abschließenden Performance-Analyse der 10 größten US-Webseiten.
Steve Souders ist es mit seinem Buch perfekt gelungen, seine Leser für dieses Thema zu sensibilisieren und eine entsprechende Begeisterung für die Möglichkeiten, die sich durch die Einhaltung seiner Regeln eröffnen, zu wecken. Ich kann das Buch jedem empfehlen, der sich für das Frontend von komplexen Webseiten verantwortlich fühlt.
Ich werde im Anschluß an diesen Artikel nach Steves Vorbild hier im Blog eine Frontend-Analyse für die 1&1 DSL-Homepage und andere große DSL-Anbieter erstellen.

Geschrieben von Nico Steiner in Referenzen um 21:23 | Kommentare (0) | Trackbacks (0)

Mittwoch, 27. August 2008

Website-Performance-Optimierung - Nützliche Links

Webseiten performant zu machen bedeutet in erster Linie, gewisse Regeln im Frontend zu beachten. Ca. 90% der Gesamtzeit der Auslieferung einer Webseite fällt in diesen Bereich.
Ganz klar muß gesagt werden, daß sich Yahoo! auf dem Gebiet der Performance-Optimierungen in hervorragender Weise hervorgetan hat. Deshalb beziehen sich auch viele der Links auf Arbeiten von Yahoo!.

Präsentationen
Zwei Präsentationen von Yahoo!-Angestellten verdeutlichen sehr gut, worauf bei einer Performance-Optimierung zu achten ist.

High Performance Websites 2008 (Nate Koechley)
Even faster Web Sites (Steve Souders)

Die zweite Präsentation kann auch als Video bei O'Reilly heruntergeladen werden: http://oreilly.com/go/fast. Im Blog von Steve Souders http://stevesouders.com/ sind weitere Videos zu dem Thema zu finden.

Websites
Yahoo! zum Zweiten. Hinter dem Link http://developer.yahoo.com/performance/ verbergen sich momentan insgesamt 34 Regeln, welche "Best Practises" bei der Performance-Optimierung darstellen. Die oben erwähnte Präsentation von Nate Koechley geht auf diese Regeln näher ein.

Literatur
Ein empfehlenswertes Buch, welches wiederum auf die Yahoo! Performance Regeln Bezug nimmt, ist High Performance Websites von Steve Souders. Eine genauere Besprechung wird hier im Blog demnächst folgen.

Tools
Yahoo! hat das Firefox-Plugin YSlow heraus gebracht, welches eine Webseite auf 13 der oben erwähnten 34 Regeln überprüft und neben einer groben Bewertung auch viele detaillierte Berichte liefert. Zu finden ist das Plugin unter http://developer.yahoo.com/yslow/.
Weiterhin gibt es einen Web-Dienst, welcher basierend auf der Software PageTest eine genaue Analyse der Auslieferungszeiten der Komponenten einer Webseite vornimmt. Neben einer grafischen Aufstellung dieser Zeiten (welche auf der IE7-Rendering Engine beruhen) werden auch verschiedene Optimierungs-Kriterien auf ihre Einhaltung überprüft. Zu finden ist der Dienst unter http://pagetest.patrickmeenan.com:8080/, welcher auch als lokale Installation verfügbar ist.

Geschrieben von Nico Steiner in Referenzen um 23:46 | Kommentare (0) | Trackbacks (0)

Mittwoch, 6. August 2008

UTF-8 - Nützliche Ressourcen

An dieser Stelle sei auf ein paar nützliche Ressourcen verwiesen, die sich mit Zeichenkodierung im Allgemeinen und mit UTF-8 im Speziellen beschäftigen.

Unicode und Zeichenkodierung im Allgemeinen
The Absolute Minimum Every Software Developer Absolutely, Positively Must Know About Unicode and Character Sets (No Excuses!)

Die Theorie zu UTF-8
UTF-8 bei Wikipedia
UTF-8 and Unicode (Gute Linksammlung)

Wie wende ich UTF-8 auf ein konkretes Projekt an? Was ist dabei zu beachten?
UTF-8: The Secret of Character Encoding
UTF-7 XSS bei Google

Geschrieben von Nico Steiner in Referenzen um 23:02 | Kommentare (0) | Trackbacks (0)