web vital issue causing render blocking issue while using typekit cdn

[Somesh34776575yrs9]

Does anyone know how to resolve this problem?

On my website, I'm using the Typekit fonts, however it's giving me an error and blocking the thread.

You cannot download CSS files that are referenced with @Import in other CSS files until the other CSS file has completely loaded. Rendering is delayed by these protracted render-blocking request chains.

[Luke Leber]

Hey!  We're seeing the same thing and have opened https://community.adobe.com/t5/adobe-fonts-discussions/out-of-date-misleading-explanation-for-why-we...

In the meantime, although this is a very imperfect solution, one can use a one-liner HTML / JS hack to remove font loading from the critical rendering path, at the cost of risking a regression in CLS.

<!-- This causes the CSS file to be interpreted as a "preload", then when it's loaded, the "onload" event changes the rel property to "stylesheet" so that the browser interprets it differently -->
<link href="https://use.typekit.net/xxxxxx.css" rel="preload" as="style" onload="this.rel='stylesheet'">

[gautama2000]

I'm surprised there isn't any more activity on this thread. Are you still using this solution @Luke Leber?

Does Adobe or anybody else have any insight on this, given that it's now June and the issue still stands?

[Luke Leber]

We aren't - having made cuts in other places, we're now hovering around 2,100 - 2,300 for LCP so we didn't have to.

[Luke Leber]

You might consider upvoting https://community.adobe.com/t5/adobe-fonts-discussions/out-of-date-misleading-explanation-for-why-we... as a better solution to this problem 🙂

[Abambo]

You might consider upvoting https://community.adobe.com/t5/adobe-fonts-discussions/out-of-date-misleading-explanation-for-why-we... as a better solution to this problem 🙂

By Luke Leber

If you want to get features implemented, you should use uservoice. https://adobefonts.uservoice.com/forums/940222-adobe-fonts-feature-requests-and-feedback?query=colla...