Host Typekit JS Locally

Question

Typekit requires us to include their JS file to render the fonts, e.g.:

<script type="text/javascript" src="https://use.typekit.com/random-name.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>

I have noticed there has been a few instances where their server is slow to response, which caused the page to halt. Unfortunately, some people have had similar experience.

I tried to host the JS file locally and it seemed to work.

<script type="text/javascript" src="http://use.typekit.com/random-name.js"></script>
<script type="text/javascript">window.Typekit || document.write('<script type="text/javascript" src="/scripts/js/ext/random-name.js">\x3C/script>')</script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>

My questions:

1. Any differences when rendering the fonts from a local JS?
2. Will the HTTP referrer be the same between using a remote JS and a local one?

Thank you.

Related:

• Loading script asynchronously
• Stop Typekit Fonts From Slowing Down Your Site

Answer 1

This is Ben from Typekit Support.

We can't guarantee that fonts will continue to work as expected if the files are hosted locally and for this reason, we don't recommend hosting the JavaScript file yourself.

To solve any slow response time issues, we recommend loading Typekit asynchronously. You can learn more about this here: http://help.typekit.com/customer/portal/articles/649336-embed-code

This code won't block rendering while the Typekit JS is loading, allowing the rest of the page to render immediately.

Answer 2

For this, and to eliminate flashes of unstyled text, I implemented a simple script that caches Typekits in localStorage: https://github.com/morris/typekit-cache - maybe this helps future typekit users running into the same problems.

Answer 3

1. No. Just try to keep JS file up to date
2. Yes. Request is still made by user browser from your domain name.