| 1 | import type { Metric } from './base.js';
|
| 2 | /**
|
| 3 | * An LCP-specific version of the Metric object.
|
| 4 | */
|
| 5 | export interface LCPMetric extends Metric {
|
| 6 | name: 'LCP';
|
| 7 | entries: LargestContentfulPaint[];
|
| 8 | }
|
| 9 | /**
|
| 10 | * An object containing potentially-helpful debugging information that
|
| 11 | * can be sent along with the LCP value for the current page visit in order
|
| 12 | * to help identify issues happening to real-users in the field.
|
| 13 | */
|
| 14 | export interface LCPAttribution {
|
| 15 | /**
|
| 16 | * The element corresponding to the largest contentful paint for the page.
|
| 17 | */
|
| 18 | element?: string;
|
| 19 | /**
|
| 20 | * The URL (if applicable) of the LCP image resource. If the LCP element
|
| 21 | * is a text node, this value will not be set.
|
| 22 | */
|
| 23 | url?: string;
|
| 24 | /**
|
| 25 | * The time from when the user initiates loading the page until when the
|
| 26 | * browser receives the first byte of the response (a.k.a. TTFB). See
|
| 27 | * [Optimize LCP](https://web.dev/articles/optimize-lcp) for details.
|
| 28 | */
|
| 29 | timeToFirstByte: number;
|
| 30 | /**
|
| 31 | * The delta between TTFB and when the browser starts loading the LCP
|
| 32 | * resource (if there is one, otherwise 0). See [Optimize
|
| 33 | * LCP](https://web.dev/articles/optimize-lcp) for details.
|
| 34 | */
|
| 35 | resourceLoadDelay: number;
|
| 36 | /**
|
| 37 | * The total time it takes to load the LCP resource itself (if there is one,
|
| 38 | * otherwise 0). See [Optimize LCP](https://web.dev/articles/optimize-lcp) for
|
| 39 | * details.
|
| 40 | */
|
| 41 | resourceLoadDuration: number;
|
| 42 | /**
|
| 43 | * The delta between when the LCP resource finishes loading until the LCP
|
| 44 | * element is fully rendered. See [Optimize
|
| 45 | * LCP](https://web.dev/articles/optimize-lcp) for details.
|
| 46 | */
|
| 47 | elementRenderDelay: number;
|
| 48 | /**
|
| 49 | * The `navigation` entry of the current page, which is useful for diagnosing
|
| 50 | * general page load issues. This can be used to access `serverTiming` for example:
|
| 51 | * navigationEntry?.serverTiming
|
| 52 | */
|
| 53 | navigationEntry?: PerformanceNavigationTiming;
|
| 54 | /**
|
| 55 | * The `resource` entry for the LCP resource (if applicable), which is useful
|
| 56 | * for diagnosing resource load issues.
|
| 57 | */
|
| 58 | lcpResourceEntry?: PerformanceResourceTiming;
|
| 59 | /**
|
| 60 | * The `LargestContentfulPaint` entry corresponding to LCP.
|
| 61 | */
|
| 62 | lcpEntry?: LargestContentfulPaint;
|
| 63 | }
|
| 64 | /**
|
| 65 | * An LCP-specific version of the Metric object with attribution.
|
| 66 | */
|
| 67 | export interface LCPMetricWithAttribution extends LCPMetric {
|
| 68 | attribution: LCPAttribution;
|
| 69 | }
|