chrome.loadTimes()
एक नॉन-स्टैंडर्ड एपीआई है. यह डेवलपर को लोडिंग मेट्रिक और नेटवर्क की जानकारी दिखाता है, ताकि वे असल दुनिया में अपनी साइट की परफ़ॉर्मेंस को बेहतर तरीके से समझ सकें.
इस एपीआई को 2009 में लागू किया गया था. इसलिए, इसमें दर्ज की जाने वाली सारी काम की जानकारी स्टैंडर्ड एपीआई में देखी जा सकती है, जैसे कि:
- नेविगेशन के लिए लगने वाला समय 2
- पेंट टाइमिंग
- Navigation Timing 2 और Resource Timing 2 के साथ
nextHopProtocol
का जोड़.
ये स्टैंडर्ड एपीआई, कई ब्राउज़र वेंडर लागू कर रहे हैं. इस
वजह से, Chrome 64 में chrome.loadTimes()
को बंद किया जा रहा है.
बंद किया गया एपीआई
chrome.loadTimes()
फ़ंक्शन एक ऑब्जेक्ट दिखाता है, जिसमें लोड करने और नेटवर्क की पूरी जानकारी होती है. उदाहरण के लिए, www.google.com पर chrome.loadTimes()
को कॉल करने का नतीजा यह है:
{
"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"
}
स्टैंडर्ड रिप्लेसमेंट
अब स्टैंडर्ड एपीआई का इस्तेमाल करके, ऊपर दी गई हर वैल्यू देखी जा सकती है. यहां दी गई टेबल में, हर वैल्यू को स्टैंडर्ड एपीआई से मैच किया गया है. साथ ही, यहां दिए गए सेक्शन में, पुराने एपीआई में मौजूद हर वैल्यू को आधुनिक एपीआई में बदलने के लिए कोड के उदाहरण दिए गए हैं.
chrome.loadTimes() सुविधा
| स्टैंडर्ड एपीआई का बदलाव |
---|---|
requestTime |
नेविगेशन के लिए लगने वाला समय 2 |
startLoadTime |
नेविगेशन के लिए लगने वाला समय 2 |
commitLoadTime |
नेविगेशन के लिए लगने वाला समय 2 |
finishDocumentLoadTime |
नेविगेशन के लिए लगने वाला समय 2 |
finishLoadTime |
नेविगेशन के लिए लगने वाला समय 2 |
firstPaintTime |
पेंट का समय |
firstPaintAfterLoadTime |
लागू नहीं |
navigationType |
नेविगेशन के लिए लगने वाला समय 2 |
wasFetchedViaSpdy |
नेविगेशन के लिए लगने वाला समय 2 |
wasNpnNegotiated |
नेविगेशन के लिए लगने वाला समय 2 |
npnNegotiatedProtocol |
नेविगेशन के लिए लगने वाला समय 2 |
wasAlternateProtocolAvailable |
लागू नहीं |
connectionInfo |
नेविगेशन के लिए लगने वाला समय 2 |
नीचे दिए गए कोड के उदाहरण, chrome.loadTimes()
से मिलने वाली वैल्यू के बराबर वैल्यू दिखाते हैं. हालांकि, नए कोड के लिए इन कोड के उदाहरणों का इस्तेमाल करने का सुझाव नहीं दिया जाता. इसकी वजह यह है कि chrome.loadTimes()
, समय की वैल्यू को epoch टाइम में सेकंड में दिखाता है, जबकि नए परफ़ॉर्मेंस एपीआई आम तौर पर किसी पेज के समय के ऑरिजिन के हिसाब से मिलीसेकंड में वैल्यू रिपोर्ट करते हैं. परफ़ॉर्मेंस का विश्लेषण करने के लिए ये ज़्यादा मददगार होते हैं.
कई उदाहरणों में, परफ़ॉर्मेंस टाइमलाइन 2 एपीआई (उदाहरण के लिए,
performance.getEntriesByType()
) का भी इस्तेमाल किया गया है. हालांकि, इनमें पुराने
Navigation Timing 1 एपीआई के लिए फ़ॉलबैक भी दिए गए हैं, क्योंकि यह ज़्यादा ब्राउज़र पर काम करता है. आने वाले समय में, परफ़ॉर्मेंस टाइमलाइन एपीआई को प्राथमिकता दी जाएगी और आम तौर पर, इनकी रिपोर्टिंग ज़्यादा सटीक तरीके से की जाएगी.
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;
}
}
वीडियो हटाने का प्लान
chrome.loadTimes()
एपीआई को Chrome 64 में बंद कर दिया जाएगा. इसे साल 2018 के आखिर में हटा दिया जाएगा. डेवलपर को अपना कोड जल्द से जल्द माइग्रेट कर लेना चाहिए, ताकि डेटा का कोई नुकसान न हो.
इस्तेमाल बंद करने का फ़ैसला | Chromestatus ट्रैकर | Chromium में मौजूद गड़बड़ी