Skip to main content
Participant
January 13, 2024
Question

web vital issue causing render blocking issue while using typekit cdn

  • January 13, 2024
  • 1 reply
  • 3211 views

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 @1552174 in other CSS files until the other CSS file has completely loaded. Rendering is delayed by these protracted render-blocking request chains.

 

 

This topic has been closed for replies.

1 reply

Participant
January 17, 2024

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-web-fonts-must-be-loaded-from-use-typekit-net/td-p/14349910

 

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'">
Participant
June 10, 2024

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?

Participant
June 10, 2024

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.