Largest Contentful Paint element — Error! in PageSpeed

[brianleejackson]

FAQ

• Yes, my issue is not about variability or throttling.
• Yes, my issue is not about a specific accessibility audit (file with axe-core instead).

URL

https://web.dev/

What happened?

"Largest Contentful Paint element — Error!" is appearing on all websites, including your own site (https://web.dev/). It appears to be a bug with the latest version of Lighthouse (Lighthouse 10.2.0) when using PageSpeed Insights.

What did you expect?

The error not to appear.

What have you tried?

Tried multiple websites with no plugins, no Cloudflare, etc. It happens regardless of the setup.

How were you running Lighthouse?

PageSpeed Insights

Lighthouse Version

Lighthouse 10.2.0

Chrome Version

No response

Node Version

No response

OS

No response

Relevant log output

No response

[adamraine]

I was able to repro. Looks interesting, this is from how we calculate TTFB in the LCP phases table:

lighthouse/core/computed/metrics/time-to-first-byte.js

Line 25 in 177af65

if (observedResponseTime === undefined) throw new Error('No response time for origin');

[erwanriou]

Yes indeed i have the same issue here too.

[adamraine]

In PSI the network response protocol event has sendEnd set to -1 so we can't compute the response time:

{
  "method": "Network.responseReceived",
  "params": {
    "requestId": "9F23D3E13238FFE8AB51366468E20311",
    "loaderId": "9F23D3E13238FFE8AB51366468E20311",
    "timestamp": 381416.814998,
    "type": "Document",
    "response": {
      "url": "https://example.com/",
      "status": 200,
      "statusText": "OK",
      "headers": {
        "X-Original-Content-Encoding": "gzip",
        "X-Original-Content-Length": "648",
        "X-ProtocolIsH2": "true",
        "X-RequestMs": "10",
        "X-ResponseMs": "1",
        "X-TCPMs": "21",
        "X-TotalFetchedSize": "1022",
        "X-TotalMs": "31",
        "accept-ranges": "bytes",
        "age": "237871",
        "cache-control": "max-age=604800",
        "content-length": "1256",
        "content-type": "text/html; charset=UTF-8",
        "date": "Mon, 15 May 2023 17:59:06 GMT",
        "etag": "\"3147526947+gzip\"",
        "expires": "Mon, 22 May 2023 17:59:06 GMT",
        "last-modified": "Thu, 17 Oct 2019 07:18:26 GMT",
        "server": "ECS (dna/63A8)",
        "vary": "Accept-Encoding",
        "x-cache": "HIT"
      },
      "mimeType": "text/html",
      "connectionReused": false,
      "connectionId": 0,
      "remoteIPAddress": "",
      "remotePort": 0,
      "fromDiskCache": false,
      "fromServiceWorker": false,
      "fromPrefetchCache": false,
      "encodedDataLength": 491,
      "timing": {
        "requestTime": 381416.777226,
        "proxyStart": -1,
        "proxyEnd": -1,
        "dnsStart": -1,
        "dnsEnd": -1,
        "connectStart": -1,
        "connectEnd": -1,
        "sslStart": -1,
        "sslEnd": -1,
        "workerStart": -1,
        "workerReady": -1,
        "workerFetchStart": -1,
        "workerRespondWithSettled": -1,
        "sendStart": -1,
        "sendEnd": -1,
        "pushStart": 0,
        "pushEnd": 0,
        "receiveHeadersEnd": 36.091
      },
      "responseTime": 1684173546352.936,
      "protocol": "http/1.1",
      "alternateProtocolUsage": "alternativeJobWonWithoutRace",
      "securityState": "secure"
    },
    "hasExtraInfo": false,
    "frameId": "9658666C7406862CD71FDB16EB0818C1"
  },
  "targetType": "page",
  "sessionId": "2868D5FDEC09D185A870591FEEA4EE6E"
},

[cptkoolbeenz]

What's even stranger is that locally, it finds the LCP with 2.3s. But on the pagespeed tool I'm seeing error

I see the same regarding PageSpeed Insights vs local Chrome Lighthouse. Error using PageSpeed but Lighthouse in Chrome shows LCP just fine.

[erwanriou]

i don't think this should affect the SEO ranking as it should be based on real user data (finger crossed haha). Meanwhile it's true that lighthouse in chrome seems to work correctly and since this tool is just a wrapper of it, sound like the error should be within the code at least.

I guess that for now (until a fix appear) if we want to know our current page-speed we can use the lighthouse devtool, am i correct @adamraine ?

[cptkoolbeenz]

i don't this should affect the SEO ranking

For me, it appears I fail Core Web Vitals using Search Console because of this issue.

[adamraine]

The audit experiencing this error is only a diagnostic used to report the LCP element, it does not directly affect your LCP value, Lighthouse score, or real user data.

I guess that for now (until a fix appear) if we want to know our current page-speed we can use the lighthouse devtool, am i correct @adamraine ?

This is correct. The only Lighthouse client we are seeing this in is PageSpeed insights. You can use Lighthouse in DevTools or the CLI until the issue is fixed.

For me, it appears I fail Core Web Vitals using Search Console because of this issue.

Lighthouse results are not used to determine your CWV ranking in search console.

[jschulte]

I can confirm this is happening for us as well (as I'm sure it is for everyone using PSI).

In the JSON returned from the test we do see the LCP timing and score:

"largest-contentful-paint": {
    "id": "largest-contentful-paint",
    "title": "Largest Contentful Paint",
    "description": "Largest Contentful Paint marks the time at which the largest text or image is painted. [Learn more about the Largest Contentful Paint metric](https://developer.chrome.com/docs/lighthouse/performance/lighthouse-largest-contentful-paint/)",
    "score": 0.97,
    "scoreDisplayMode": "numeric",
    "displayValue": "0.9 s",
    "numericValue": 885,
    "numericUnit": "millisecond"
}

However the LCP element data shows an error:

"largest-contentful-paint-element": {
    "id": "largest-contentful-paint-element",
    "title": "Largest Contentful Paint element",
    "description": "This is the largest contentful element painted within the viewport. [Learn more about the Largest Contentful Paint element](https://developer.chrome.com/docs/lighthouse/performance/lighthouse-largest-contentful-paint/)",
    "score": null,
    "scoreDisplayMode": "error",
    "errorMessage": "No response time for origin"
}

[adamraine]

@WalrusSoup that is indeed a separate issue, please file a new bug.

[brianleejackson]

Appreciate the communication @adamraine !

[connorjclark]

The root cause here is that network requests timings object is always -1 for our netstack in LR (except for requestTime and receiveHeadersEnd, because that is the only thing Chrome knows about directly). We have _updateTimingsForLightrider to pluck some timings into lrStatistics but that was only ever done for offline analysis. We should be updating timings too, as many things (like network-rtt, and ttfb) calculate from that object.

[connorjclark]

A fix for this has been rolled out / is currently rolling out now (we disabled the offending code in the audit, but will re-introduce the phases table with proper support soon).

[synth]

We are seeing this now in Page Speed Insights. It popped up after we fixed a report that the content responsible for LCP was loaded lazily. We removed the lazy loading and now are consistently getting this error.

[adamraine]

@synth can you share what URL you are testing on?

[synth]

We made some separate fixes and now that item is no longer showing up for us, so we're not able to reproduce it anymore. Will post back if it shows up and it can repro'd for you. Thanks.

[adamraine]

Closing as fixed, if anyone sees this again please let us know.

[StanFromTraction]

I see it quite often, but inconsistently
https://pagespeed.web.dev/analysis/https-charismatic-remember-816555-framer-app/rgbgl7xasz?form_factor=desktop

[synth]

Actually, same. We've seen it pop up again since the previous time, but inconsistently.

[adamraine]

I can repro this, will investigate