Trang này được dịch bởi Cloud Translation API.

Chrome 64 sẽ ngừng sử dụng API chrome.loadTimes()

Philip Walton

chrome.loadTimes() là một API không chuẩn, hiển thị các chỉ số tải và thông tin mạng cho nhà phát triển để giúp họ hiểu rõ hơn về hiệu suất của trang web trong thực tế.

Kể từ khi API này được triển khai vào năm 2009, bạn có thể tìm thấy tất cả thông tin hữu ích mà API này báo cáo trong các API được chuẩn hoá, chẳng hạn như:

Điều hướng theo thời gian 2
Thời gian vẽ
Bổ sung nextHopProtocol cho Navigation Timing 2 và Resource Timing 2.

Nhiều nhà cung cấp trình duyệt đang triển khai những API đã chuẩn hoá này. Do đó, chrome.loadTimes() sẽ không được dùng nữa trong Chrome 64.

API không dùng nữa

Hàm chrome.loadTimes() trả về một đối tượng duy nhất chứa tất cả thông tin tải và mạng. Ví dụ: đối tượng sau đây là kết quả của việc gọi chrome.loadTimes() trên 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"
}

Nội dung thay thế được chuẩn hoá

Giờ đây, bạn có thể tìm thấy từng giá trị nêu trên bằng các API đã chuẩn hoá. Bảng sau đây so khớp từng giá trị với API được chuẩn hoá và các phần bên dưới cho thấy ví dụ về mã về cách lấy từng giá trị trong API cũ với các giá trị tương đương hiện đại.

Tính năng `chrome.loadTimes()`	Thay thế API được chuẩn hoá
`requestTime`	Điều hướng theo thời gian 2
`startLoadTime`	Thời gian điều hướng 2
`commitLoadTime`	Điều hướng theo thời gian 2
`finishDocumentLoadTime`	Thời gian điều hướng 2
`finishLoadTime`	Điều hướng theo thời gian 2
`firstPaintTime`	Thời gian vẽ
`firstPaintAfterLoadTime`	Không áp dụng
`navigationType`	Điều hướng theo thời gian 2
`wasFetchedViaSpdy`	Thời gian điều hướng 2
`wasNpnNegotiated`	Điều hướng theo thời gian 2
`npnNegotiatedProtocol`	Điều hướng theo thời gian 2
`wasAlternateProtocolAvailable`	Không áp dụng
`connectionInfo`	Thời gian điều hướng 2

Các ví dụ về mã dưới đây trả về các giá trị tương đương với các giá trị mà chrome.loadTimes() trả về. Tuy nhiên, bạn không nên sử dụng các ví dụ về mã này cho mã mới. Lý do là chrome.loadTimes() cung cấp các giá trị thời gian theo thời gian bắt đầu tính bằng giây, trong khi các API hiệu suất mới thường báo cáo các giá trị tính bằng mili giây so với gốc thời gian của trang. Giá trị này thường hữu ích hơn cho việc phân tích hiệu suất.

Một số ví dụ cũng ưu tiên các API Performance Timeline 2 (Dòng thời gian hiệu suất 2) (ví dụ: performance.getEntriesByType()) nhưng cung cấp phương án dự phòng cho API Navigation Timing 1 cũ hơn vì API này có hỗ trợ trình duyệt rộng hơn. Từ giờ trở đi, bạn nên sử dụng API Dòng thời gian hiệu suất và thường được báo cáo với độ chính xác cao hơn.

`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;
  }
}

Kế hoạch xoá

API chrome.loadTimes() sẽ ngừng hoạt động trong Chrome 64 và dự kiến sẽ bị xoá vào cuối năm 2018. Nhà phát triển nên di chuyển mã càng sớm càng tốt để tránh mất dữ liệu.

Ý định ngừng sử dụng | Trình theo dõi trạng thái Chrome | Lỗi Chromium