To speed up loading times I want to preload a font using this GP hook (wp-head): <link rel="preload" href="/wp-content/plugins/elementor/assets/lib/font-awesome/webfonts/fa-solid-900.woff2" as="font" type="font/woff2" crossorigin>
But Google PageSpeed keeps giving me this warning: Warnings: A preload <link> was found for [url] but this has not been used by the browser. Check if you are using the crossorigin attribute correctly.
Yes, you are right. In the html the attibutes are missing. Still, in the webhook the code is correct and complete (as far as I know). Here’s what it looks like in WP: https://imgshare.io/image/zV5qe
Yep! WP is not stripping that one. Nice! Still the same error message keeps popping up though. As long as the browser is not using the preload rule, there is no benefit.
Hold up! I just tried PageSpeed again, and the message is gone. So I guess it’s working now, although I don’t see any speed increase. On the contrary, it takes longer. But it seems this error is solved, so thanks for helping out!
Looks like our replies got crossed….
Problem you have preloading a font is that it render blocks the site being displayed. So the delay is all up front.
I personally would suggest looking at how to get rid of Font Awesome icons if you can.