| 1 | /*
|
| 2 | * Copyright 2022 Google LLC
|
| 3 | *
|
| 4 | * Licensed under the Apache License, Version 2.0 (the "License");
|
| 5 | * you may not use this file except in compliance with the License.
|
| 6 | * You may obtain a copy of the License at
|
| 7 | *
|
| 8 | * https://www.apache.org/licenses/LICENSE-2.0
|
| 9 | *
|
| 10 | * Unless required by applicable law or agreed to in writing, software
|
| 11 | * distributed under the License is distributed on an "AS IS" BASIS,
|
| 12 | * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
| 13 | * See the License for the specific language governing permissions and
|
| 14 | * limitations under the License.
|
| 15 | */
|
| 16 |
|
| 17 | import {Metric, ReportCallback} from './base.js';
|
| 18 | import {NavigationTimingPolyfillEntry} from './polyfills.js';
|
| 19 |
|
| 20 | /**
|
| 21 | * An LCP-specific version of the Metric object.
|
| 22 | */
|
| 23 | export interface LCPMetric extends Metric {
|
| 24 | name: 'LCP';
|
| 25 | entries: LargestContentfulPaint[];
|
| 26 | }
|
| 27 |
|
| 28 | /**
|
| 29 | * An object containing potentially-helpful debugging information that
|
| 30 | * can be sent along with the LCP value for the current page visit in order
|
| 31 | * to help identify issues happening to real-users in the field.
|
| 32 | */
|
| 33 | export interface LCPAttribution {
|
| 34 | /**
|
| 35 | * The element corresponding to the largest contentful paint for the page.
|
| 36 | */
|
| 37 | element?: string;
|
| 38 | /**
|
| 39 | * The URL (if applicable) of the LCP image resource. If the LCP element
|
| 40 | * is a text node, this value will not be set.
|
| 41 | */
|
| 42 | url?: string;
|
| 43 | /**
|
| 44 | * The time from when the user initiates loading the page until when the
|
| 45 | * browser receives the first byte of the response (a.k.a. TTFB). See
|
| 46 | * [Optimize LCP](https://web.dev/optimize-lcp/) for details.
|
| 47 | */
|
| 48 | timeToFirstByte: number;
|
| 49 | /**
|
| 50 | * The delta between TTFB and when the browser starts loading the LCP
|
| 51 | * resource (if there is one, otherwise 0). See [Optimize
|
| 52 | * LCP](https://web.dev/optimize-lcp/) for details.
|
| 53 | */
|
| 54 | resourceLoadDelay: number;
|
| 55 | /**
|
| 56 | * The total time it takes to load the LCP resource itself (if there is one,
|
| 57 | * otherwise 0). See [Optimize LCP](https://web.dev/optimize-lcp/) for
|
| 58 | * details.
|
| 59 | */
|
| 60 | resourceLoadTime: number;
|
| 61 | /**
|
| 62 | * The delta between when the LCP resource finishes loading until the LCP
|
| 63 | * element is fully rendered. See [Optimize
|
| 64 | * LCP](https://web.dev/optimize-lcp/) for details.
|
| 65 | */
|
| 66 | elementRenderDelay: number;
|
| 67 | /**
|
| 68 | * The `navigation` entry of the current page, which is useful for diagnosing
|
| 69 | * general page load issues.
|
| 70 | */
|
| 71 | navigationEntry?: PerformanceNavigationTiming | NavigationTimingPolyfillEntry;
|
| 72 | /**
|
| 73 | * The `resource` entry for the LCP resource (if applicable), which is useful
|
| 74 | * for diagnosing resource load issues.
|
| 75 | */
|
| 76 | lcpResourceEntry?: PerformanceResourceTiming;
|
| 77 | /**
|
| 78 | * The `LargestContentfulPaint` entry corresponding to LCP.
|
| 79 | */
|
| 80 | lcpEntry?: LargestContentfulPaint;
|
| 81 | }
|
| 82 |
|
| 83 | /**
|
| 84 | * An LCP-specific version of the Metric object with attribution.
|
| 85 | */
|
| 86 | export interface LCPMetricWithAttribution extends LCPMetric {
|
| 87 | attribution: LCPAttribution;
|
| 88 | }
|
| 89 |
|
| 90 | /**
|
| 91 | * An LCP-specific version of the ReportCallback function.
|
| 92 | */
|
| 93 | export interface LCPReportCallback extends ReportCallback {
|
| 94 | (metric: LCPMetric): void;
|
| 95 | }
|
| 96 |
|
| 97 | /**
|
| 98 | * An LCP-specific version of the ReportCallback function with attribution.
|
| 99 | */
|
| 100 | export interface LCPReportCallbackWithAttribution extends LCPReportCallback {
|
| 101 | (metric: LCPMetricWithAttribution): void;
|
| 102 | }
|