Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Preload key requests audit still showing linked resources that have been placed in the head with preload parameters #11982

Closed
Surf-And-Sand opened this issue Jan 20, 2021 · 11 comments

Comments

@Surf-And-Sand
Copy link

Provide the steps to reproduce

  1. Run LH on https://gogonihon.com/en/

What is the current behavior?

Lighthouse audit for preload key requests has 3 fonts recommended to be preloaded.

What is the expected behavior?

I would expect that there are no fonts showing in the preload key requests audit, since they've already been place in the head with preload parameters.

Environment Information

  • Affected Channels: DevTools - Lighthouse
  • Lighthouse version:
  • Chrome version: Version 87.0.4280.141 (Official Build) (x86_64)
  • Node.js version:
  • Operating System: OSX Big Sur 11.1

Related issues
I've also tried removing those fonts from my stylesheet, and the issue persists where Lighthouse keeps saying to preload these font resources.

@patrickhulce
Copy link
Collaborator

patrickhulce commented Jan 20, 2021

Thanks for filing @Surf-And-Sand!

I'm not seeing any existing preload elements in the head. Could you be thinking of preconnect that's already there?

image

These fonts come from the autooptimize.css and do block rendering of the text on the page. That being said we are re-evaluating our preload advice in #11960 that might hide these suggestions in the future.

@Surf-And-Sand
Copy link
Author

Surf-And-Sand commented Jan 21, 2021 via email

@Surf-And-Sand
Copy link
Author

Surf-And-Sand commented Jan 21, 2021 via email

@InfiniteSpirals
Copy link

It looks like you are using a non-standard double quote in the href of your preload. When you follow from the source it resolves to https://gogonihon.com/en/%E2%80%9D/wp-content/themes/gogoworld/assets/font/Roboto/Roboto-Bold.ttf which 404's...

@Surf-And-Sand
Copy link
Author

Surf-And-Sand commented Jan 22, 2021 via email

@InfiniteSpirals
Copy link

Hey @Surf-And-Sand, looks like you are now serving the assets from a CDN url in your preload (https://mk0gogonihonsps6abbx.kinstacdn.com), but your css is still requesting these from the root domain as well. Source of those requests is https://mk0gogonihonsps6abbx.kinstacdn.com/wp-content/cache/autoptimize/css/autoptimize_798817135892f595448cc27c320cc9cf.css you can see this in the network tab if you filter by fonts.

image

@Surf-And-Sand
Copy link
Author

I was able to pass the lighthouse audit by putting the requested assets explicitly (full uri) in both the head and style files.

Thanks for your assistance folks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants
@patrickhulce @InfiniteSpirals @Surf-And-Sand @devtools-bot and others