link preload must have a valid ‘as’ value after preloading url

I’ll need an URL to see what is in the HTML source haydenng664 ??

Alright.

The URL resources errors that you see in the console is exactly those that I included in the Preload specific requests

• This reply was modified 4 years, 3 months ago by Hayden Ng.
• This reply was modified 4 years, 3 months ago by Hayden Ng.

Edit your post immediately to remove it (I can’t).

Having a look now.

OK, otf-fonts aren’t recognized properly by AO, let me go fix that for you (on the Github version), more soon ..

Alright cool! Let me know once it is fixed Thanks! ??

Also would you know what is causing this error?

Resource interpreted as Document but transferred with MIME type image/gif: “data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==”.

OK, https://github.com/futtta/autoptimize/commit/c71e47a13db34fdda08f28e96a4f9d7ce4347f73 should fix it, would be great if you could download the beta-version from Github and install that instead of the current version to test?

Resource interpreted as Document but transferred with MIME type image/gif: “data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==”.

based on a quick base64 decode (on https://www.base64decode.org) that is an image, not HTML. it’s the image lazyload placeholder set by smush.

I see thanks!

I tried changed the line of code in the plugin editor according to the link you provided instead of installing the beta. It seems to remove the error.

• This reply was modified 4 years, 3 months ago by Hayden Ng.
• This reply was modified 4 years, 3 months ago by Hayden Ng.

But this error is still there

The resource … was preloaded using link preload but not used within a few seconds from the window’s load event. Please make sure it has an appropriate as value and it is preloaded intentionally.

Can you try clearing your page cache(s) haydenng664 ?

I cleared it. The errors are still there. Also I noticed this error appeared in Google Page Speed Test that wasn’t there before.

Ensure text remains visible during webfont load
Warnings: Lighthouse was unable to automatically check the font-display values for the origin (my website url)

• This reply was modified 4 years, 3 months ago by Hayden Ng.
• This reply was modified 4 years, 3 months ago by Hayden Ng.

well, I can confirm that the OTF files are now recognized and added with the correct as value (iso as="other");

<link rel="preload" href="https://bizsphere.com.my/wp-content/themes/betheme/fonts/Hero-Light.otf" as="font" type="font/otf" crossorigin><link rel="preload" href="https://bizsphere.com.my/wp-content/themes/betheme/fonts/Hero.otf" as="font" type="font/otf" crossorigin>

But if & how browsers use that information is not something I/ AO can enforce ??

re. font visibility; that is something to change in the CSS, making sure the relevant @font-face declarations come with font-display: swap (or fallback), see https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for more info.

Can I know where do you add this?

<link rel="preload" href="https://bizsphere.com.my/wp-content/themes/betheme/fonts/Hero-Light.otf" as="font" type="font/otf" crossorigin>
<link rel="preload" href="https://bizsphere.com.my/wp-content/themes/betheme/fonts/Hero.otf" as="font" type="font/otf" crossorigin>

Apparently, there are more than only the two that needs to be configured this way.
This URL especially: https://bizsphere.com.my/wp-content/plugins/vc-extensions-bundle/css/admin_icon.css?ver=5.5.3

• This reply was modified 4 years, 3 months ago by Hayden Ng.
• This reply was modified 4 years, 3 months ago by Hayden Ng.
• This reply was modified 4 years, 3 months ago by Hayden Ng.