Skip to content

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

License

Notifications You must be signed in to change notification settings

trkoch/typekit-cache

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

23 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Typekit Cache

Keeps a site's Typekit in localStorage and injects it on page load. Completely eliminates the annoying Flash Of Invisible/Unstyled Text 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>
	try{!function(t,e,n,r,a,s,i,l) // ...
</script>
<script>
	(function(d) {
		var config = {
			kitId: 'abcd1234',
			scriptTimeout: 3000
		},
		h=d.documentElement, // ...
	})(document);
</script>

Notes

Works in recent Firefox, Chrome, Safari, and IE. Please contribute issues and pull requests if you find any quirks. Check typekit-cache.js for more information.

Quota errors in localStorage are silently ignored. The quota is set to 0 in Safari Privat Mode so Typekits will not be cached.

Typekits may be quite large, and the performance impact of injecting them as inline stylesheets is not well tested.

The minified version is built using uglifyjs typekit-cache.js -o typekit-cache.min.js --compress --mangle.

Contributors

Thanks!

About

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

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 100.0%