201003Mär

RequireJS: JavaScript-Dateien als Module laden

Bei größeren Projekten kann es vorkommen, dass durch die Komplexität mehrere JavaScript-Dateien verwendet werden oder diese aufgrund eines bestehenden Frameworks schon vorhanden sind. Dann kann es der Fall sein, dass bestimmte Funktionen oder Aufrufe erst erfolgen sollen, nachdem eine Bibliothek fertig geladen wurde. Als Entwickler hat man ohne zusätzlichen JavaScript-Code keinen Einfluss auf die Reihenfolge, in der die Dateien einer Website geladen werden. Eine Möglichkeit besteht in der Umstrukturierung des HTML-Gerüsts, doch dieser Ansatz lässt sich in der Praxis nur selten umsetzen.
Um JavaScript-Dateien nun als separate Module zu nutzen, bietet sich ein Skript wie RequireJS an — dadurch werden Befehle erst dann ausgeführt, wenn die gewünschten Skripte fertig geladen wurden. Die Implementierung für das einfache Laden von mehreren Dateien könnte dann so aussehen:

  • <script src="scripts/require.js"></script>
  • <script>
  • require(["datei1.js", "datei2.js", "datei3.js"],
  • function() {
  • // This function will be called when all the
  • // dependencies listed above are loaded.
  • // Note that this function could be called
  • // before the page is loaded. This callback
  • // is optional.
  • }
  • );
  • </script>

Mit RequireJS lassen sich Skripte zudem als Module mit bestimmten Abhängigkeiten behandeln. Weiterhin können sich mit der Bibliothek Sprachvarianten (I18N) für die Ausgabe von Texten erstellt werden. Mehr über die Verwendung der unterschiedlichen Funktionen findet sich in der API-Dokumentation. Eine Schnittstelle für jQuery ist ebenfalls enthalten.
Interessant ist schließlich das Optimization Tool, das den Google Closure Compiler nutzt, um mehrere JavaScript-Dateien in einer Datei zu kombinieren. Dieser Schritt sollte am Ende der Entwicklungsphase stehen und reduziert die Anzahl der Requests, die für ein JavaScript-Projekt benötigt werden.

RSS-Feed abonnieren Bookmark bei Del.icio.us