Awesome

Resilient.js

resilience

the capacity to recover quickly from difficulties; toughness.

Resilient.js is a script loader proof-of-concept made to load a given JS file from different URLs. There is no perfect CDNs, and there are better CDNs for each country or continent. With that lib, we try to load a JS file from different CDNs, until we succesfully download the file.

Usage

Resilient.js should be the first script to be loaded in your page. Instantiate it like so

if (Resilient.isSupported()) {
  var resilient = new Resilient();
  resilient.init();
}

In your <script> tag, use the data attributes data-alt-src and data-module

<script
  src="https://code.jquery.com/jquery-2.1.3.min.js"
  data-module="jquery"
  data-alt-src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"
></script>

resilient.on('load', ['jquery'], function() {
  console.log('jQuery loaded');
  // From now on it is safe to use your code that depends on jQuery
});

If something goes wrong while loading a module, an error event will be fired. And another try to load the script will be made using the data-alt-src.

resilient.on('error', ['jquery'], function() {
  console.log('Error while loading jQuery')
});

It always possible to listen to all load and error events using the * wildcard.

resilient
  .on('error', ['*'], function(moduleName) {
    console.log('Error while loading ' + moduleName);
  })
  .on('load', ['*'], function(moduleName) {
    console.log(moduleName + ' loaded');
  });

API

on

instance.on('eventName', ['moduleName1', 'moduleName2'], callback);

off

instance.off('eventName', ['moduleName1', 'moduleName2']);

trigger

instance.trigger('eventName', ['moduleName1', 'moduleName2']);

Events

load

Triggered when a script tag was loaded.

error

Triggered when there was an error loading a script.

Browser Support

Latest ✔	Latest ✔	11+ ✔	Latest ✔	6.0+ ✔

Credits

• Icon by Stephen Borengasser