Last active
August 29, 2015 14:03
-
-
Save Ianfeather/1730c1a81819efdb273c to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<head> | |
// If the user has a cookie don't render the critical css to the page | |
// Ensure it matches the md5 hash of our critical css so we can cache bust | |
- if cookies[:inline_css_cached] == critical_css_ref | |
// Instead get the styles from local storage | |
<script> | |
var styles = document.createElement('style'), | |
firstScript = document.getElementsByTagName('script')[0]; | |
styles.innerHTML = window.localStorage.getItem('critical-ccs-' + {{ critical_css_ref} }); | |
firstScript.parentNode.insertBefore(styles, firstScript); | |
</script> | |
- else | |
// If the user doesn't have the cookie, render the css to the head as normal | |
<style id="js-critical-css" data-ref={{ critical_css_ref }}> | |
// Render our critical css | |
</style> | |
</head> | |
<body> | |
<div class="footer"> | |
- if cookies[:inline_css_cached] != critical_css_ref | |
<script> | |
// Store the contents of our critical css in LS | |
window.localStorage.setItem('critical-ccs-' + {{ critical_css_ref }}, document.getElementById('js-critical-css').innerHTML); | |
// Set the cookie for the next visit | |
document.cookie = "inline_css_cached:{{ critical_css_ref }};" | |
</script> | |
</div> | |
</body> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment