webVitalsAttribution

Bei der Fehlersuche zu Web Vitals ist es oft hilfreich, die Quelle des Problems genau zu lokalisieren. Beispielsweise möchten wir bei Cumulative Layout Shift (CLS) möglicherweise wissen, welches Element zuerst verschoben wurde, als der größte Layoutwechsel auftrat. Oder im Fall von Largest Contentful Paint (LCP) möchten wir das Element identifizieren, das dem LCP der Seite entspricht. Wenn es sich beim LCP-Element um ein Bild handelt, kann die URL der Bildressource helfen, das zu optimierende Asset zu finden.

Die Identifizierung des größten Beiträgers zur Web Vitals-Bewertung, auch Attribution genannt, ermöglicht es uns, detailliertere Informationen wie Einträge für PerformanceEventTiming, PerformanceNavigationTiming und PerformanceResourceTiming zu erhalten.

Attribution ist in Next.js standardmäßig deaktiviert, kann aber pro Metrik aktiviert werden, indem Sie Folgendes in next.config.js angeben.

experimental: {
  webVitalsAttribution: ['CLS', 'LCP']
}

Gültige Attributionswerte sind alle web-vitals-Metriken, die im NextWebVitalsMetric Typ angegeben sind.