Performance API

Измерение производительности приложения с высокой точностью.

Зачем нужно

Точный замер времени выполнения кода, загрузки ресурсов, навигации. Точность до микросекунд. Данные для Core Web Vitals.

Где используется

  • Профилирование узких мест в коде
  • Мониторинг метрик загрузки (LCP, FCP, TTFB)
  • Замеры производительности API-вызовов

Code

// Точный timestamp
const start = performance.now();
doSomething;
console.log(`Took ${performance.now() - start}ms`);

// Метки и замеры
performance.mark('start-render');
renderApp;
performance.mark('end-render');
performance.measure('render', 'start-render', 'end-render');

const [measure] = performance.getEntriesByName('render');
console.log(`Render: ${measure.duration}ms`);

// Метрики загрузки страницы
const nav = performance.getEntriesByType('navigation')[0];
console.log(`DOM ready: ${nav.domContentLoadedEventEnd}ms`);

// Ресурсы
performance.getEntriesByType('resource').forEach(r => {
  console.log(r.name, r.duration);
});

// PerformanceObserver
new PerformanceObserver((list) => {
  list.getEntries.forEach(entry => console.log(entry));
}).observe({ entryTypes: ['largest-contentful-paint'] });

Связанные темы

Ресурсы