chrome.loadTimes()
to niestandardowy interfejs API, który ujawnia wskaźniki wczytywania i
i informacjami o sieciach,
dzięki czemu deweloperzy będą mogli lepiej
w świecie rzeczywistym.
Ponieważ ten interfejs API został wdrożony w 2009 r., wszystkie przydatne w nim informacje występujące w standardowych interfejsach API, takich jak:
- Czas nawigacji 2
- Czas renderowania
nextHopProtocol
Navigation Timing 2 oraz Czas zasobów 2.
Te standardowe interfejsy API są wdrażane przez wielu dostawców przeglądarek. Jako
W efekcie interfejs chrome.loadTimes()
jest wycofywany z Chrome 64.
Wycofany interfejs API
Funkcja chrome.loadTimes()
zwraca pojedynczy obiekt zawierający wszystkie
wczytywania i informacji o sieci. Na przykład ten obiekt jest wynikiem
połączenia do chrome.loadTimes()
na www.google.com:
{
"requestTime": 1513186741.847,
"startLoadTime": 1513186741.847,
"commitLoadTime": 1513186742.637,
"finishDocumentLoadTime": 1513186742.842,
"finishLoadTime": 1513186743.582,
"firstPaintTime": 1513186742.829,
"firstPaintAfterLoadTime": 0,
"navigationType": "Reload",
"wasFetchedViaSpdy": true,
"wasNpnNegotiated": true,
"npnNegotiatedProtocol": "h2",
"wasAlternateProtocolAvailable": false,
"connectionInfo": "h2"
}
Ustandaryzowane zamienniki
Każdą z powyższych wartości znajdziesz teraz, korzystając ze standardowych interfejsów API. Poniżej dopasowuje każdą wartość do jej standardowego interfejsu API, a sekcje poniżej pokazują, przykładowe sposoby pobierania wartości ze starego interfejsu API z nowoczesnymi odpowiednikami.
chrome.loadTimes() funkcja
| Standardowa wymiana interfejsu API |
---|---|
requestTime |
Czas nawigacji 2 . |
startLoadTime |
Czas nawigacji 2 . |
commitLoadTime |
Czas nawigacji 2 . |
finishDocumentLoadTime |
Czas nawigacji 2 . |
finishLoadTime |
Czas nawigacji 2 . |
firstPaintTime |
Czas renderowania . |
firstPaintAfterLoadTime |
Nie dotyczy |
navigationType |
Czas nawigacji 2 . |
wasFetchedViaSpdy |
Czas nawigacji 2 . |
wasNpnNegotiated |
Czas nawigacji 2 . |
npnNegotiatedProtocol |
Czas nawigacji 2 . |
wasAlternateProtocolAvailable |
Nie dotyczy |
connectionInfo |
Czas nawigacji 2 . |
Poniższe przykłady kodu zwracają równoważne wartości do tych zwróconych przez funkcję
chrome.loadTimes()
Jednak w przypadku nowego kodu te przykłady nie są
zalecane. Powodem jest to, że funkcja chrome.loadTimes()
podaje wartości czasu w czasie epoki w sekundach, a nowe interfejsy API wydajności
zwykle podają wartości w milisekundach związane z
początku czasu, który zwykle
przydatniejsze w analizie skuteczności.
W kilku przykładach faworyzowane są też interfejsy API Performance Timeline 2 (np.
performance.getEntriesByType()
), ale podaj wartości zastępcze dla starszych
Interfejs API Navigation Timing 1 zgodnie z obecnymi ustawieniami.
i większą obsługę przeglądarek. Od tej pory preferujemy interfejsy API osi czasu skuteczności
i są zwykle
raportowane z większą precyzją.
requestTime
function requestTime() {
// If the browser supports the Navigation Timing 2 and HR Time APIs, use
// them, otherwise fall back to the Navigation Timing 1 API.
if (window.PerformanceNavigationTiming && performance.timeOrigin) {
const ntEntry = performance.getEntriesByType('navigation')[0];
return (ntEntry.startTime + performance.timeOrigin) / 1000;
} else {
return performance.timing.navigationStart / 1000;
}
}
startLoadTime
function startLoadTime() {
// If the browser supports the Navigation Timing 2 and HR Time APIs, use
// them, otherwise fall back to the Navigation Timing 1 API.
if (window.PerformanceNavigationTiming && performance.timeOrigin) {
const ntEntry = performance.getEntriesByType('navigation')[0];
return (ntEntry.startTime + performance.timeOrigin) / 1000;
} else {
return performance.timing.navigationStart / 1000;
}
}
commitLoadTime
function commitLoadTime() {
// If the browser supports the Navigation Timing 2 and HR Time APIs, use
// them, otherwise fall back to the Navigation Timing 1 API.
if (window.PerformanceNavigationTiming && performance.timeOrigin) {
const ntEntry = performance.getEntriesByType('navigation')[0];
return (ntEntry.responseStart + performance.timeOrigin) / 1000;
} else {
return performance.timing.responseStart / 1000;
}
}
finishDocumentLoadTime
function finishDocumentLoadTime() {
// If the browser supports the Navigation Timing 2 and HR Time APIs, use
// them, otherwise fall back to the Navigation Timing 1 API.
if (window.PerformanceNavigationTiming && performance.timeOrigin) {
const ntEntry = performance.getEntriesByType('navigation')[0];
return (ntEntry.domContentLoadedEventEnd + performance.timeOrigin) / 1000;
} else {
return performance.timing.domContentLoadedEventEnd / 1000;
}
}
finishLoadTime
function finishLoadTime() {
// If the browser supports the Navigation Timing 2 and HR Time APIs, use
// them, otherwise fall back to the Navigation Timing 1 API.
if (window.PerformanceNavigationTiming && performance.timeOrigin) {
const ntEntry = performance.getEntriesByType('navigation')[0];
return (ntEntry.loadEventEnd + performance.timeOrigin) / 1000;
} else {
return performance.timing.loadEventEnd / 1000;
}
}
firstPaintTime
function firstPaintTime() {
if (window.PerformancePaintTiming) {
const fpEntry = performance.getEntriesByType('paint')[0];
return (fpEntry.startTime + performance.timeOrigin) / 1000;
}
}
firstPaintAfterLoadTime
function firstPaintTimeAfterLoad() {
// This was never actually implemented and always returns 0.
return 0;
}
navigationType
function navigationType() {
if (window.PerformanceNavigationTiming) {
const ntEntry = performance.getEntriesByType('navigation')[0];
return ntEntry.type;
}
}
wasFetchedViaSpdy
function wasFetchedViaSpdy() {
// SPDY is deprecated in favor of HTTP/2, but this implementation returns
// true for HTTP/2 or HTTP2+QUIC/39 as well.
if (window.PerformanceNavigationTiming) {
const ntEntry = performance.getEntriesByType('navigation')[0];
return ['h2', 'hq'].includes(ntEntry.nextHopProtocol);
}
}
wasNpnNegotiated
function wasNpnNegotiated() {
// NPN is deprecated in favor of ALPN, but this implementation returns true
// for HTTP/2 or HTTP2+QUIC/39 requests negotiated via ALPN.
if (window.PerformanceNavigationTiming) {
const ntEntry = performance.getEntriesByType('navigation')[0];
return ['h2', 'hq'].includes(ntEntry.nextHopProtocol);
}
}
npnNegotiatedProtocol
function npnNegotiatedProtocol() {
// NPN is deprecated in favor of ALPN, but this implementation returns the
// HTTP/2 or HTTP2+QUIC/39 requests negotiated via ALPN.
if (window.PerformanceNavigationTiming) {
const ntEntry = performance.getEntriesByType('navigation')[0];
return ['h2', 'hq'].includes(ntEntry.nextHopProtocol) ?
ntEntry.nextHopProtocol : 'unknown';
}
}
wasAlternateProtocolAvailable
function wasAlternateProtocolAvailable() {
// The Alternate-Protocol header is deprecated in favor of Alt-Svc
// (https://www.mnot.net/blog/2016/03/09/alt-svc), so technically this
// should always return false.
return false;
}
connectionInfo
function connectionInfo() {
if (window.PerformanceNavigationTiming) {
const ntEntry = performance.getEntriesByType('navigation')[0];
return ntEntry.nextHopProtocol;
}
}
Plan usunięcia
Interfejs chrome.loadTimes()
API zostanie wycofany w Chrome 64 i kierowany na
usunięta pod koniec 2018 r. Deweloperzy powinni jak najszybciej przenieść swój kod
aby uniknąć utraty danych.
Zamiar wycofania | Narzędzie do śledzenia stanu Chrome | Błąd Chromium