Meet npm Pro: unlimited public & private packages + package-based permissions.Learn more »

asynccss

0.0.5 • Public • Published

AsyncCSS

Build Status NPM version

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

Licensed MIT

Install

With npm do:

npm install asynccss --save

With bower do:

bower install asynccss --save

Usage

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

Example

<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>

Run automated-tests

$grunt mocha_phantomjs

Changelog

  • 0.0.5 - Garbage collector now removes only old version of a provided 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

Keywords

none

Install

npm i asynccss

DownloadsWeekly Downloads

1

Version

0.0.5

License

none

Last publish

Collaborators

  • avatar