Menu
Has anyone tried successfully to reduce loading times of Typekit by using preload or prefetch? i.e.
<link rel='preload' href='...' as='font'>
<!-- and/or -->
<link rel='prefetch' href='...'>
Is it a practical or possible in the current Typekit loading setup?
906
In summary, without font preloading, you might run into a situation where a browser is ready to load your site's text, but it can't because the font isn't available yet. That is, it needs to download the font before it can paint the text.
dns-prefetch : indicates to the browser that it should perform the resolution of a given domain name (determining the IP to contact) before that domain is used to download resources. preconnect : indicates to the browser that it should connect a given origin, before that domain is used to download resources.
Adobe Fonts isn't available as a standalone product like Typekit was, so you will need a subscription to Creative Cloud to use the service. Creative Cloud gives designers access to software like Photoshop, Illustrator, After Effects, InDesign, etc.
Today we're announcing some changes, starting with the name of our service: Typekit is now Adobe Fonts. As Adobe Fonts, we are consolidating all previous Typekit plans into one streamlined service that gives you our complete library as part of all Creative Cloud plans.
You could try preloading Typekit's script:
<link rel="preload" href="https://use.typekit.net/[YOUR_KIT_ID].js" as="script">
I've tested this and it does seem to work. The 'loading order' of waterfall changes — the Typekit script moved up to tie second with my main (deferred) javascript file. As for performance, I'm not seeing much improvement — if any at all.
66
As of today, link rel='preload' is not implemented by any browser.
I have tried using link rel='prefetch', and Chrome did prefetch that font, however, it ignored the prefetched font and downloaded it again when it needed it.
23
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
