Was ist der beste Weg, Client-Seite Ladezeiten zu messen?

StackOverflow https://stackoverflow.com/questions/547458

Frage

Ich suche die Benutzerfreundlichkeit unserer Website und Link, mit Timing-Informationen bereits auf der Server-Seite angemeldet zu überwachen. Meine Vermutung ist, dass diese Javascript erforderlich wird Zeitstempel zu Beginn der Anfrage (window.onbeforeunload) und am Ende des Ladens (window.onload) zu erfassen. Im Grunde ist dies - „ Mess Webanwendung Reaktionszeit : Treffen Sie den Client "

  1. Gibt es einen besseren Ansatz?
  2. Welche Art von Leistungseinbuße sollte ich (Größenordnung) erwarten?
  3. Wie gut sind die Ergebnisse?
War es hilfreich?

Lösung

EDIT (2013): versuchen Boomerang statt, wie @ Yasei-no-umi vermuten lässt. Es wird aktiv gepflegt.

- alte Antwort -

Wir verwenden Jiffy .

Es ist sehr einfach zu bedienen und ändern - wir unseren eigenen serverseitigen Code geschrieben (statt Jiffys Apache + Perl) und Jiffys JS verwendet

.

Im Hinblick auf eine Leistungseinbuße - es gibt keine auf der Client-Seite. Die JS selbst ist trivialerweise schnell, und die Berichterstattung an den Server zurück kann mit einer XHR nach Laden der Seite erfolgen, die nichts in der Benutzerfreundlichkeit auswirkt. Auf der Serverseite werden Sie doppelt so viele Anfragen bekommen. Wenn das ein Engpass ist, könnten Sie einen anderen Server nur für die Zeitantworten eingestellt.

Andere Tipps

Es gibt auch Boomerang von Yahoo.

Hat einige erweiterte Funktionen, die nicht in Jiffy bestehenden und Folgen. Auch Navigation Timing API in Browsern unterstützt, die es unterstützen (Chrome 6, IE 9)

Der Vollständigkeit halber können Sie nun die Navigation Timing-API in einigen der moderne Browser verwenden: https://developer.mozilla.org/en-US/docs/Navigation_timing 

function onLoad() { 
  var now = new Date().getTime();
  var page_load_time = now - performance.timing.navigationStart;
  console.log("User-perceived page loading time: " + page_load_time);
}

3rd party bearbeiten

Basierend auf caniuse.com Navigation Timing wird heute weitgehend unterstützt (10/2016)

Was ist mit etwas Verwendung wie Yslow (eine Firefox-Erweiterung) ?

Eine Alternative zu Jiffy a href ist <= "http: // stevesouders.com/episodes/“rel = "nofollow noreferrer"> Episodes .

Beide beinhalten instrumentiert Ihre Javascript Spur von verschiedenen Zeitpunkten zu halten, und diese Timings auf einem zentralen Server anmelden.

Wir haben ein „Rückruf“ (ein 1x1 transparentes GIF-Bild mit einem Parameter, der die ID für die Seite machen darstellt) in der Seite, die ein „Seite betrachtet“, um unsere Datenbank protokolliert. Das ist Datensätze mit der gleichen Kennung, die Seite selbst aufgezeichnet wird, und wir haben einen Protokolleintrag, wenn unser Rendering abgeschlossen ist.

So haben wir Zeit:

  • Seite Vorbereitung gestartet
  • Seite Vorbereitung / Response beendet
  • Client telefoniert-home wenn sie abgeschlossen sind Rendering

Hilft bei Kunden zu verstehen, die "langsamen" (CPU oder ISP / Bandbreite)

sind

P. S. Seite macht das nicht nennen zu Hause ist von Interesse zu - der Benutzer geklickt-off (unter der Annahme, dass andere Seite macht in dieser Sitzung ein Phone Home tat aufzeichnen)

Ich bin mir ziemlich zweifelhaft diese Methoden. Einige dieser Methoden sind komplexer als notwendig und ich frage für die Richtigkeit dieser Daten. Was ich tun würde, ist Tester verschiedene Netzwerke gehen und so etwas wie Firebug oder etwas verwenden:

http://getfirebug.com/

Für das Heck von ihm; hier ist ein interessantes Papier vor kurzem SOSP auf einem Werkzeug vorgelegt genannt AjaxScope. Interessanterweise ist es ein wissenschaftlicher Artikel, präsentiert von MS-Forschung, die in einigen Fällen Firefox Javascript Implementierung der Durchführung oft besser als Internet Explorer zeigt. :)

http://research.microsoft.com/en-us /groups/rad/sosp07.pdf

Wir neigen dazu, eine Kombination aus zu verwenden:

Firefox: Web Developer Toolbar Firebug YSlow

IE: Fiddler

aus all diesen habe ich festgestellt YSlow gibt die besten Informationen darüber, was Sie tun können, um die Ladezeiten zu verbessern, aber Fiddler gibt die beste Gesamt Informationen darüber, was Sie über den Draht erwarten können, und können sogar verschiedene simulieren Netzwerkgeschwindigkeiten.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top