إصدار 64 من Chrome لإيقاف واجهة برمجة التطبيقات chrome.loadTimes()

Philip Walton

chrome.loadTimes() هي واجهة برمجة تطبيقات غير عادية تعرض مقاييس التحميل ومقاييس الشبكة للمطوّرين لمساعدتهم في فهم أداء موقعهم الإلكتروني بشكل أفضل في الواقع.

منذ أن تم تطبيق واجهة برمجة التطبيقات هذه في عام 2009، يمكن العثور على جميع المعلومات المفيدة التي تقدمها في تقارير واجهات برمجة التطبيقات الموحدة، مثل:

• موعد التنقّل 2
• وقت التلوين
• nextHopProtocol إضافة إلى Navigation Timing 2 و Resource Timing 2

يتم تنفيذ واجهات برمجة التطبيقات هذه الموحدة من قِبل مورّدين متعدّدين للمتصفّحات. نتيجةً لذلك، سيتم إيقاف chrome.loadTimes() نهائيًا في الإصدار 64 من Chrome.

واجهة برمجة التطبيقات المتوقّفة نهائيًا

تعرض الدالة chrome.loadTimes() عنصرًا واحدًا يحتوي على جميع معلومات التحميل والشبكة. على سبيل المثال، العنصر التالي هو نتيجة للاتصال بالرقم chrome.loadTimes() على 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"
}

عمليات الاستبدال الموحدة

يمكنك الآن العثور على كل قيمة من القيم أعلاه باستخدام واجهات برمجة التطبيقات الموحدة. يطابق الجدول التالي كل قيمة مع واجهة برمجة التطبيقات الموحدة، وتوضّح الأقسام أدناه أمثلة على الرموز البرمجية حول كيفية الحصول على كل قيمة في واجهة برمجة التطبيقات القديمة باستخدام نظائرها الحديثة.

تعرِض أمثلة الرموز البرمجية أدناه قيمًا مكافئة لتلك التي تعرِضها دالّة chrome.loadTimes(). ومع ذلك، لا يُنصح باستخدام أمثلة الرموز البرمجية هذه في الرموز البرمجية الجديدة. والسبب هو أنّ chrome.loadTimes() يوفّر قيم الأوقات في وقت البدء بالثواني، في حين أنّ واجهات برمجة التطبيقات الجديدة للأداء تُبلغ عادةً عن القيم بالمللي ثانية بالنسبة إلى مصدر الوقت للصفحة، ما يميل إلى أن يكون أكثر فائدةً لتحليل الأداء.

تفضّل العديد من الأمثلة أيضًا واجهات برمجة تطبيقات Performance Timeline 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. على المطوّرين نقل رموزهم البرمجية في أقرب وقت ممكن لتجنّب فقدان أي بيانات.

القرار بإيقاف الميزة نهائيًا | تتبُّع حالة Chrome | خطأ في Chromium