Qual è il modo migliore per misurare i tempi di caricamento delle pagine lato client?

Question

Sto cercando di monitorare l'esperienza dell'utente finale del nostro sito e link che con informazioni di temporizzazione già registrato sul lato server. La mia ipotesi è che questo richiede javascript per catturare data e ora di inizio richiesta (window.onbeforeunload) e alla fine del carico (window.onload). Fondamentalmente questo - " tempo di risposta delle applicazioni di misurazione Web : Incontra il cliente "

1. C'è un approccio migliore?
2. Che tipo di penalizzazione delle prestazioni dovrei aspettavo (ordine di grandezza)?
3. Come buoni sono i risultati?

Answer 1

EDIT (2013): prova a Boomerang invece, come @ Yasei-no-umi suggerisce. E 'attivamente mantenuta.

- risposta vecchia -

Jiffy .

E 'molto semplice da usare e modificare - abbiamo scritto il nostro codice lato server (invece di Apache + perl di Jiffy) e utilizzato JS di Jiffy

.

Per quanto riguarda una riduzione delle prestazioni - non c'è uno sul lato client. Il JS stesso è banalmente veloce, e la segnalazione al server può essere fatto con un XHR dopo caricamento della pagina, che colpisce nulla nella user experience. Sul lato server si otterrà il doppio delle richieste. Se questo è un collo di bottiglia, è possibile impostare un server diverso solo per le risposte di sincronizzazione.

Answer 2

C'è anche Boomerang da Yahoo.

ha alcune caratteristiche avanzate non esistenti in Jiffy ed episodi. Anche il supporto Navigation Timing API nei browser che lo supportano (Chrome 6, IE 9)

Answer 3

Per completezza, è ora possibile utilizzare la sincronizzazione API di navigazione in alcune delle moderne browser: 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);
}

terze parti Modifica

In base a caniuse.com navigazione tempistica è ampiamente supportato oggi (10/2016)

Answer 4

Che dire utilizzando qualcosa come YSlow (un'estensione per Firefox) ?

Answer 5

Un'alternativa a Jiffy è episodi .

Sia coinvolgere strumentazione Javascript per tenere traccia dei vari tempi, e la registrazione quei tempi su un server centrale.

Answer 6

Abbiamo un (un'immagine GIF 1x1 trasparente con un parametro che rappresenta l'ID del rendering della pagina) "call back" nella pagina che registra un "Pagina letta" nella banca dati. Questo è record con lo stesso ID che la pagina stessa viene registrato, e noi abbiamo una voce di registro quando la nostra resa finisce.

Così abbiamo ora:

• preparazione Page iniziato
• preparazione Page / Response finito
• Client telefonato-casa, quando il rendering completato

Aiuta a capire i clienti che sono "lento" (CPU o ISP / larghezza di banda)

P.S. Pagina rende che non chiamare casa sono di interesse troppo - l'utente fa clic-off (supponendo che altra pagina esegue il rendering in quella sessione ha fatto registrare un telefono di casa)

Answer 7

Sono abbastanza dubbia di questi metodi. Alcuni di questi metodi sono più complesse di quanto necessario e metto in discussione l'esattezza di questi dati. Quello che mi piacerebbe fare è di avere tester vanno a varie reti e usare qualcosa come Firebug o qualcosa:

http://getfirebug.com/

Per il gusto di farlo; qui è un documento interessante recentemente presentato al SOSP su uno strumento chiamato AjaxScope. È interessante notare, si tratta di un articolo scientifico, presentata da MS Research, che mostra implementazione JavaScript di Firefox di eseguire molte volte meglio di Internet Explorer in pochi casi. :)

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

Answer 8

Si tende a utilizzare una combinazione di:

Firefox: Web Developer Toolbar Firebug YSlow

IE: Fiddler

di tutti questi, ho trovato YSlow dà il meglio di informazioni su cosa si può fare per migliorare i tempi di caricamento, ma Fiddler fornisce la migliore informazione complessiva su ciò che ci si può aspettare oltre il filo, e può anche simulare diverse velocità di rete.