Какие знаешь метрики в браузере

В браузере есть несколько ключевых метрик для измерения производительности:

1. FCP (First Contentful Paint) – время появления первого контента (текст, изображение).
2. LCP (Largest Contentful Paint) – загрузка самого большого элемента в viewport (обычно hero-блок).
3. TTI (Time to Interactive) – когда страница становится интерактивной (откликается на действия).
4. CLS (Cumulative Layout Shift) – визуальная стабильность (измеряет неожиданные сдвиги контента).
5. FID (First Input Delay) – задержка реакции на первый клик/ввод.

Пример измерения через PerformanceObserver:

const observer = new PerformanceObserver((list) => {
  for (const entry of list.getEntries()) {
    console.log(entry.name, entry.startTime);
  }
});
observer.observe({ type: 'largest-contentful-paint', buffered: true });