Beiträge tagged mit yepnope

Alle Beiträge

yepnope.js der schlauere Resource Loader

“A conditional loader for your polyfills” bezeichnet yepnope ihren cleveren Resource-Loader.  Dabei handelt es sich um einen asynchronen Loader, der flink arbeitet und dabei hilft, nur die Skripte zu laden, die auch tatsächlich auf dem jeweiligen Browser benötigt werden und gegebenenfalls Fallbacks (polyfills) für den Browser nachzuladen.

Als sehr praktisch erweist sich das, wenn man z.B HTML5 und CSS3 Seiten für die neusten Browser entwickelt, dabei aber die “altgedienten” Browser wie Internet Explorer oder Firefox 3 nicht ins offene Messer laufen lassen will.

Yepnope fungiert dabei als Javascript Loader, der die Polyfills erst bei Bedarf nachlädt und dabei selbst als intelligente Weiche arbeitet.  Yepnope.js ist mit nur 1,6 KB (GZip,minified) erstaunlich schlank.

Ein Test Objekt hat bei yepnpope.js immer folgenden Aufbau:

yepnope([{
  test : /* boolean(ish) - Something truthy that you want to test             */,
  yep  : /* array (of strings) | string - The things to load if test is true  */,
  nope : /* array (of strings) | string - The things to load if test is false */,
  both : /* array (of strings) | string - Load everytime (sugar)              */,
  load : /* array (of strings) | string - Load everytime (sugar)              */,
  callback : /* function ( testResult, key ) | object { key : fn }            */,
  complete : /* function                                                      */
}, ... ]);

So kann yepnope.js z.B. Resource Fallbacks laden und nebenher abhängige Skripte laden. Hier ein Beispiel aus der yepnope.js Dokumentation:

yepnope([{
  load: 'http:/­/ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js',
  complete: function () {
    if (!window.jQuery) {
      yepnope('local/jquery.min.js');
    }
  }
}, {
  load: 'jquery.plugin.js',
  complete: function () {
    jQuery(function () {
      jQuery('div').plugin();
    });
  }
}]);


Alles in allem ein wirklich schlauer Loader, der einem das Entwicklerherz höher schlagen lässt.