PerformanceEntry: свойство startTime

Только для чтения startTime свойство возвращает первую метку времени, записанную для этой PerformanceEntry. Значение этого свойства зависит от значения entryType этой записи.

DOMHighResTimeStamp представляющий первую метку времени, когда была создана PerformanceEntry.

Значение этого свойства зависит от значения entryType этой записи производительности:

element

Либо значение свойства renderTime этой записи, если оно не 0, иначе значение свойства loadTime.

event

Время создания события, т.е. свойство timeStamp события.

first-input

Время создания первого события ввода, т.е. timeStamp этого события.

largest-contentful-paint

Значение свойства renderTime этой записи, если оно не 0, иначе значение свойства loadTime.

layout-shift

Время начала сдвига макета.

longtask

Время начала задачи.

mark

Время создания метки с помощью вызова performance.mark().

measure

Время создания измерения с помощью вызова performance.measure().

navigation

Всегда 0.

paint

Время, когда произошла отрисовка.

resource

Значение свойства fetchStart этой записи.

taskattribution

Всегда 0.

visibility-state

Время изменения состояния видимости.

Следующий пример демонстрирует использование свойства startTime, которое можно записывать во время наблюдения за производительностью.

Примечание: метод performance.mark() позволяет устанавливать собственные startTime, а метод performance.measure() позволяет устанавливать начало измерения.

performance.mark("my-mark");
performance.mark("my-other-mark", { startTime: 12.5 });

loginButton.addEventListener("click", (clickEvent) => {
  performance.measure("login-click", { start: clickEvent.timeStamp });
});

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"] });