chrome.loadTimes() API-কে অবমূল্যায়ন করতে Chrome 64

chrome.loadTimes() হল একটি নন-স্ট্যান্ডার্ড API যা ডেভেলপারদের কাছে লোডিং মেট্রিক্স এবং নেটওয়ার্কের তথ্য প্রকাশ করে যাতে তাদেরকে বাস্তব জগতে তাদের সাইটের পারফরম্যান্স আরও ভালভাবে বুঝতে সাহায্য করে।

যেহেতু এই APIটি 2009 সালে প্রয়োগ করা হয়েছিল, এটির রিপোর্ট করা সমস্ত দরকারী তথ্য প্রমিত APIগুলিতে পাওয়া যেতে পারে যেমন:

এই প্রমিত APIগুলি একাধিক ব্রাউজার বিক্রেতা দ্বারা প্রয়োগ করা হচ্ছে৷ ফলস্বরূপ, Chrome 64-এ chrome.loadTimes() অবচয় করা হচ্ছে।

অপসারিত API

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"
}

মানসম্মত প্রতিস্থাপন

আপনি এখন প্রমিত API ব্যবহার করে উপরের প্রতিটি মান খুঁজে পেতে পারেন। নিম্নলিখিত সারণীটি প্রতিটি মানকে তার প্রমিত API-এর সাথে মেলে, এবং নীচের বিভাগগুলি আধুনিক সমতুল্য সহ পুরানো API-এ প্রতিটি মান কীভাবে পেতে হয় তার কোড উদাহরণগুলি দেখায়৷

chrome.loadTimes() বৈশিষ্ট্য মানসম্মত API প্রতিস্থাপন
requestTime নেভিগেশন টাইমিং 2
startLoadTime নেভিগেশন টাইমিং 2
commitLoadTime নেভিগেশন টাইমিং 2
finishDocumentLoadTime নেভিগেশন টাইমিং 2
finishLoadTime নেভিগেশন টাইমিং 2
firstPaintTime পেইন্ট টাইমিং
firstPaintAfterLoadTime N/A
navigationType নেভিগেশন টাইমিং 2
wasFetchedViaSpdy নেভিগেশন টাইমিং 2
wasNpnNegotiated নেভিগেশন টাইমিং 2
npnNegotiatedProtocol নেভিগেশন টাইমিং 2
wasAlternateProtocolAvailable N/A
connectionInfo নেভিগেশন টাইমিং 2

নীচের কোডের উদাহরণগুলি chrome.loadTimes() দ্বারা প্রত্যাবর্তিত মানগুলির সমতুল্য মান প্রদান করে৷ যাইহোক, নতুন কোডের জন্য এই কোড উদাহরণগুলি সুপারিশ করা হয় না। কারণটি হল chrome.loadTimes() সেকেন্ডে যুগের সময়ে সময়ের মান দেয় যেখানে নতুন পারফরম্যান্স API সাধারণত একটি পৃষ্ঠার সময় উৎপত্তির সাপেক্ষে মিলিসেকেন্ডে মানগুলি রিপোর্ট করে, যা কার্যক্ষমতা বিশ্লেষণের জন্য আরও কার্যকর হতে থাকে।

বেশ কয়েকটি উদাহরণও পারফরম্যান্স টাইমলাইন 2 এপিআই (যেমন performance.getEntriesByType() ) এর পক্ষে কিন্তু পুরানো নেভিগেশন টাইমিং 1 API-এর জন্য ফলব্যাক প্রদান করে কারণ এটিতে বিস্তৃত ব্রাউজার সমর্থন রয়েছে। সামনের দিকে, পারফরম্যান্স টাইমলাইন এপিআইগুলিকে অগ্রাধিকার দেওয়া হয় এবং সাধারণত উচ্চ নির্ভুলতার সাথে রিপোর্ট করা হয়।

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;
}
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() API Chrome 64-এ বাতিল করা হবে এবং 2018 সালের শেষের দিকে সরিয়ে ফেলার লক্ষ্য রয়েছে। ডেভেলপারদের যত তাড়াতাড়ি সম্ভব ডেটার কোনো ক্ষতি এড়াতে তাদের কোড স্থানান্তর করা উচিত।

অবমূল্যায়ন করার অভিপ্রায় | Chromestatus ট্র্যাকার | ক্রোমিয়াম বাগ

,

chrome.loadTimes() হল একটি নন-স্ট্যান্ডার্ড API যা ডেভেলপারদের কাছে লোডিং মেট্রিক্স এবং নেটওয়ার্কের তথ্য প্রকাশ করে যাতে তাদেরকে বাস্তব জগতে তাদের সাইটের পারফরম্যান্স আরও ভালভাবে বুঝতে সাহায্য করে।

যেহেতু এই APIটি 2009 সালে প্রয়োগ করা হয়েছিল, এটির রিপোর্ট করা সমস্ত দরকারী তথ্য প্রমিত APIগুলিতে পাওয়া যেতে পারে যেমন:

এই প্রমিত APIগুলি একাধিক ব্রাউজার বিক্রেতা দ্বারা প্রয়োগ করা হচ্ছে৷ ফলস্বরূপ, Chrome 64-এ chrome.loadTimes() অবচয় করা হচ্ছে।

অপসারিত API

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"
}

মানসম্মত প্রতিস্থাপন

আপনি এখন প্রমিত API ব্যবহার করে উপরের প্রতিটি মান খুঁজে পেতে পারেন। নিম্নলিখিত সারণীটি প্রতিটি মানকে তার প্রমিত API-এর সাথে মেলে, এবং নীচের বিভাগগুলি আধুনিক সমতুল্য সহ পুরানো API-এ প্রতিটি মান কীভাবে পেতে হয় তার কোড উদাহরণগুলি দেখায়৷

chrome.loadTimes() বৈশিষ্ট্য মানসম্মত API প্রতিস্থাপন
requestTime নেভিগেশন টাইমিং 2
startLoadTime নেভিগেশন টাইমিং 2
commitLoadTime নেভিগেশন টাইমিং 2
finishDocumentLoadTime নেভিগেশন টাইমিং 2
finishLoadTime নেভিগেশন টাইমিং 2
firstPaintTime পেইন্ট টাইমিং
firstPaintAfterLoadTime N/A
navigationType নেভিগেশন টাইমিং 2
wasFetchedViaSpdy নেভিগেশন টাইমিং 2
wasNpnNegotiated নেভিগেশন টাইমিং 2
npnNegotiatedProtocol নেভিগেশন টাইমিং 2
wasAlternateProtocolAvailable N/A
connectionInfo নেভিগেশন টাইমিং 2

নীচের কোডের উদাহরণগুলি chrome.loadTimes() দ্বারা প্রত্যাবর্তিত মানগুলির সমতুল্য মান প্রদান করে৷ যাইহোক, নতুন কোডের জন্য এই কোড উদাহরণগুলি সুপারিশ করা হয় না। কারণটি হল chrome.loadTimes() সেকেন্ডে যুগের সময়ে সময়ের মান দেয় যেখানে নতুন পারফরম্যান্স API সাধারণত একটি পৃষ্ঠার সময় উৎপত্তির সাপেক্ষে মিলিসেকেন্ডে মানগুলি রিপোর্ট করে, যা কার্যক্ষমতা বিশ্লেষণের জন্য আরও কার্যকর হতে থাকে।

বেশ কয়েকটি উদাহরণও পারফরম্যান্স টাইমলাইন 2 এপিআই (যেমন performance.getEntriesByType() ) এর পক্ষে কিন্তু পুরানো নেভিগেশন টাইমিং 1 API-এর জন্য ফলব্যাক প্রদান করে কারণ এটিতে বিস্তৃত ব্রাউজার সমর্থন রয়েছে। সামনের দিকে, পারফরম্যান্স টাইমলাইন এপিআইগুলিকে অগ্রাধিকার দেওয়া হয় এবং সাধারণত উচ্চ নির্ভুলতার সাথে রিপোর্ট করা হয়।

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;
}
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() API Chrome 64-এ বাতিল করা হবে এবং 2018 সালের শেষের দিকে সরিয়ে ফেলার লক্ষ্য রয়েছে। ডেভেলপারদের যত তাড়াতাড়ি সম্ভব ডেটার কোনো ক্ষতি এড়াতে তাদের কোড স্থানান্তর করা উচিত।

অবমূল্যায়ন করার অভিপ্রায় | Chromestatus ট্র্যাকার | ক্রোমিয়াম বাগ