WARNING - THIS PROJECT IS NO LONGER MAINTAINED!!!
A function for asynchronous loading of non-critical CSS and deferring Web Fonts, which leverages localStorage for caching. When a new version of file supplied (app.css?v2) any old versions (app.css?xx) are being removed from localStorage automatically
This work heavily influenced by
- Breaking news at 1000ms, Patrick Hamann, The Guardian
- BBC News team optimization experiments
- Improving Smashing Magazine’s Performance: A Case Study
Licensed MIT
With npm do:
npm install asynccss --save
With bower do:
bower install asynccss --save
asyncCss( [ path, .. ], options? );
options:
{Boolean} [debug="false"] - is verbose mode? (tells what it does in the console log)
{String} [ns="css_cache_"] - namespace per asyncCss call. If you reuse asyncCss later in your JavaScript,
supply a different `ns`. That will prevent the garbage collector from cleaning up items cached in a previous call.
{Function} [done=function(){}] - callback function<head>
...
<script type="text/javascript">
(function(){
<?php include ".../asyncCss.min.js"; ?>
try {
asyncCss( [ "css/foo.css", "css/bar.css" ], { debug: true } );
} catch( e ) {
console.log( "asyncCss: exception " + e );
}
}());
</script>
<noscript>
<link href="css/foo.css" rel="stylesheet">
<link href="css/bar.css" rel="stylesheet">
</noscript>
...
</head>$grunt mocha_phantomjs
- 0.0.5 - Garbage collector now removes only old version of a concrete supplied css file.
- 0.0.4 - Automated tests supplied
- 0.0.3 - A separate cache namespace can be supplied now per asyncCss call
- 0.0.2 - Hotfix: missing early exit was causing async loading even after CSS is present in the cache
- 0.0.1 - First commit
