performance.now — монотонное измерение прошедшего времени!

performance.now() — Web API для точного измерения времени выполнения и длительности операций. В отличие от Date.now(), возвращает монотонно возрастающее время с дробной точностью.

Значение (DOMHighResTimeStamp) — миллисекунды от time origin (performance.timeOrigin), обычно начала навигации документа. Точность может ограничиваться браузером из соображений безопасности.

Простейшее измерение:

const start = performance.now();

doHeavyWork();

const end = performance.now();
console.log(`Время: ${end - start} ms`);

performance.now() удобен для профилирования синхронных операций и поиска узких мест в коде.

Пример 1 — измерение функции:

function measure(fn) {
  const t0 = performance.now();
  fn();
  const t1 = performance.now();
  return t1 - t0;
}

console.log("A:", measure(runA));
console.log("B:", measure(runB));

Один замер может быть неточным из-за JIT-компиляции, GC и фоновых процессов браузера, поэтому для корректного сравнения алгоритмов лучше делать несколько прогонов.

Пример 2 — измерение асинхронного кода:

async function measureAsync(fn) {
  const t0 = performance.now();
  await fn();
  return performance.now() - t0;
}

measureAsync(fetchData)
  .then(t => console.log("Время операции:", t));

Здесь измеряется общее прошедшее время операции, включая ожидание промиса.

Пример 3 — проверка бюджета кадра:

const t0 = performance.now();

renderLargeList();

const t1 = performance.now();

if (t1 - t0 > 16.7) {
  console.warn("JS-часть кадра превысила бюджет (~16.7ms при 60Hz)");
}

При 120Hz бюджет кадра уже около 8.3 ms, и в него входит не только выполнение JS, но и layout, paint и compositing.

Пример 4 — разница с Date.now:

console.log(Date.now());        // системное время
console.log(performance.now()); // монотонное время

Date.now() может изменяться при корректировке системных часов, тогда как performance.now() монотонно увеличивается в рамках текущего контекста выполнения.

🔥 performance.now() — базовый инструмент для ручного профилирования производительности и быстрых замеров в UI-коде.

📣 Code Ready | #практика