Skip to content
Branch: master
Go to file
Code

Latest commit

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 
 
 

README.md

Typekit Cache

Revision 14

Keeps a site's Typekit in localStorage and injects it on page load. Eliminates the annoying Flash Of Invisible/Unstyled Text (FOUT) and provides better UX for slow or offline connections.

The same requests are sent as in loading a Typekit regularly, and the Typekit embed code is unaltered. However, using this script may still violate the Typekit Terms Of Use.

Usage

Copy the contents of typekit-cache.min.js right before your Typekit (advanced) embed code. That's it, your website should be caching your Typekit happily.

<script>
  !function(e,t,n,a,l,m,c,o,s,d,g,i){ /* ... */ }( /* ... */ );
</script>
<script>
  (function(d) {
    var config = {
      kitId: 'abcd1234',
      scriptTimeout: 3000
    },
    h=d.documentElement, // ...
  })(document);
</script>

Notes

The regular Typekit behavior is not modified at all. Exceptions visible in the console (e.g. if the storage is not available) can be safely ignored. However, you should use separate <script> tags to ensure the Typekit embed code is still run if an exception occurs.

In addition to the regular wf-* classes, the wf-cached class is added to the <html> tag on cache hit.

To use sessionStorage instead, just replace the localStorage reference.

Contributing

Make sure PRs contain an updated minified version. Run npm run prepublish to build it.

Contributors

Thanks!

About

Keeps a site's Typekit in localStorage and injects it on page load, eliminating the Flash Of Invisible/Unstyled Text.

Topics

Resources

License

You can’t perform that action at this time.