12

Próbuję uzyskać na przykład czas loadEventEnd w konsoli. Możesz to zrobić przez performance timing 2 API lub performance timing API. uzyskać takie same wyniki w ten sposób obliczeń:Chrome - Różnica między czasem zdarzenia w devtools a Linią czasu wykonania interfejsu API

performance.getEntriesByType("navigation")[0].loadEventEnd 
// 483.915 
chrome.loadTimes().finishLoadTime * 1000 - chrome.loadTimes().startLoadTime * 1000 
// 484 
performance.timing.loadEventEnd - performance.timing.navigationStart 
// 484 

Ale w zakładce Linia czasu w DevTools mogę spowodować 510 ms. Różnice są przedstawione na tym zdjęciu:

enter image description here

Ten problem występuje w innych miejscach: w konsoli zawsze uzyskać krótsze czasy niż na zakładce Linia czasu. Czy ktoś może wyjaśnić tę różnicę? Który jeden raz jest prawdziwy?

+1

Niestety, z jakiegoś powodu moja instalacja Chrome 58.0.3029.96 (64-bit) nie ma zakładki Oś czasu, więc mogę” • zapewnić rzeczywiste badania. Mam jednak przeczucie, że różnica między konsolą a osią czasu wynika z niewielkiego opóźnienia, niezbędnego do uruchomienia JavaScript dla nowej karty. W twoim przykładzie różnica wynosi 30 ms - czy sprawdziłeś, czy coś dzieje się na karcie Oś czasu wokół znaku 30 ms? – Dragomok

+1

@Dragomok Masz rację. Na 26 ms na osi czasu pojawia się zdarzenie 'navigationStart'. Więc jeśli odejmiesz od 'loadEventEnd'' navigationStart' skończysz z 484 ms. Problem polegał na tym, że oś czasu została zarejestrowana przed 'navigationStart', która jest inna dla' nawigacji-taktowania-api'. – Everettss

+1

@Dragomok w wersji 58 osi czasu znajduje się teraz w zakładce Wydajność. – Everettss

Odpowiedz

1

Jak @Dragomok w komentarzu sugerują: rekord

navigation-timing-api rozpoczyna się navigationStart imprezy. Oś czasu na karcie Wydajność uruchamia rekordy "jakiś czas" przed zdarzeniem navigationStart, dlatego performance.getEntriesByType("navigation")[0].loadEventEnd daje mniejszą wartość niż loadEventEnd na osi czasu.

Jeśli obliczysz oś czasu loadEventEnd - navigationStart, otrzymasz tę samą wartość, co w przypadku navigation-timing-api.

Oto dowód na zdjęciach: enter image description here


enter image description here

Powiązane problemy