font-display:swap fonts shouldn't affect lantern lcp

I’m a bit confused about the recommendation uses-rel-preload and the resulting LCP score. Without font preloading the LCP score looks ok and results in a 100 % rating in the performance category:

After adding the suggested preloading lines for my fonts the LCP increased a lot and the performance rating goes down to 80 %:

The preloading lines I use looks like this:

<link rel="preload" as="font" href="/fonts/Metropolis.woff2" type="font/woff2" crossorigin="anonymous">
<link rel="preload" as="font" href="/fonts/LiberationSans.woff2" type="font/woff2" crossorigin="anonymous">
<link rel="preload" as="font" href="/fonts/LiberationSans-Bold.woff2" type="font/woff2" crossorigin="anonymous">
<link rel="preload" as="font" href="/fonts/LiberationSans-BoldItalic.woff2" type="font/woff2" crossorigin="anonymous">
<link rel="preload" as="font" href="/fonts/LiberationSans-Italic.woff2" type="font/woff2" crossorigin="anonymous">
<link rel="preload" as="font" href="/fonts/LiberationMono.woff2" type="font/woff2" crossorigin="anonymous">
<link rel="preload" as="font" href="/fonts/DroidSans.woff2" type="font/woff2" crossorigin="anonymous">

What am I doing wrong? Any way to get preloading and the LCP together? Thanks a lot for your help.

[patrickhulce]

No, changes to lantern like this requires are large investments and are only shipped with major versions. There is no immediate plan to tackle this.

[patrickhulce]

You’re all good you actually filed in LHCI @xoxys but I moved the issue to the core repo because any issue computing the performance metrics won’t be LHCI specific 😃

I can repro locally now thanks for the download link 👍

This is a bug in simulated throttling. Basically the preloaded fonts now load before LCP and Lighthouse includes them in our pessimistic estimate of LCP. It only happens on localhost because they load so fast that Chrome doesn’t even have a chance to get a paint out. When the page is hosted somewhere remotely we see the expected behavior.

As a temporary workaround you can use

ci:
  collect:
    settings:
      throttlingMethod: devtools

but either way it’s not a real problem with the performance of the page.

To the Lighthouse team, I think it’s time to finally include more than just trace/devtools information in our lantern graph creation. These fonts are all display swap and we shouldn’t be including them in the LCP calculation.