PerformanceEntry
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2017.
Note: This feature is available in Web Workers.
Đối tượng PerformanceEntry đóng gói một chỉ số hiệu năng đơn lẻ, là một phần của performance timeline của trình duyệt.
Performance API cung cấp các chỉ số dựng sẵn là những lớp con chuyên biệt của PerformanceEntry. Điều này bao gồm các entry cho tải tài nguyên, thời gian sự kiện, và nhiều hơn nữa.
Bạn cũng có thể tạo một performance entry bằng cách gọi các phương thức Performance.mark() hoặc Performance.measure() tại một điểm cụ thể trong ứng dụng. Điều này cho phép bạn thêm các chỉ số riêng của mình vào performance timeline.
Các thể hiện PerformanceEntry luôn thuộc một trong các lớp con sau:
LargestContentfulPaintLayoutShiftPerformanceEventTimingPerformanceLongAnimationFrameTimingPerformanceLongTaskTimingPerformanceMarkPerformanceMeasurePerformanceNavigationTimingPerformancePaintTimingPerformanceResourceTimingPerformanceScriptTimingPerformanceServerTimingTaskAttributionTimingVisibilityStateEntry
Thuộc tính instance
PerformanceEntry.nameRead only-
Một chuỗi biểu thị tên của performance entry. Giá trị phụ thuộc vào lớp con.
PerformanceEntry.entryTypeRead only-
Một chuỗi biểu thị loại chỉ số hiệu năng. Ví dụ,
"mark"khi dùngPerformanceMark. PerformanceEntry.startTimeRead only-
Một
DOMHighResTimeStampbiểu thị thời điểm bắt đầu của chỉ số hiệu năng. PerformanceEntry.durationRead only-
Một
DOMHighResTimeStampbiểu thị thời lượng của performance entry.
Phương thức instance
PerformanceEntry.toJSON()-
Trả về biểu diễn JSON của đối tượng
PerformanceEntry.
Ví dụ
>Làm việc với performance entry
Ví dụ sau tạo các đối tượng PerformanceEntry thuộc các kiểu PerformanceMark và PerformanceMeasure.
Các lớp con PerformanceMark và PerformanceMeasure kế thừa các thuộc tính duration, entryType, name, và startTime từ PerformanceEntry và gán cho chúng các giá trị phù hợp.
// Đặt tại vị trí trong mã bắt đầu đăng nhập
performance.mark("login-started");
// Đặt tại vị trí trong mã kết thúc đăng nhập
performance.mark("login-finished");
// Đo thời lượng đăng nhập
performance.measure("login-duration", "login-started", "login-finished");
function perfObserver(list, observer) {
list.getEntries().forEach((entry) => {
if (entry.entryType === "mark") {
console.log(`${entry.name}'s startTime: ${entry.startTime}`);
}
if (entry.entryType === "measure") {
console.log(`${entry.name}'s duration: ${entry.duration}`);
}
});
}
const observer = new PerformanceObserver(perfObserver);
observer.observe({ entryTypes: ["measure", "mark"] });
Thông số kỹ thuật
| Specification |
|---|
| Performance Timeline> # dom-performanceentry> |