Laden von JavaScript und CSS - Teil 3
Um nicht übermäßig viele Requests zum Laden der Scripte und Styles zum Server machen zu müssen, wurde von meinem Teamkollegen Michael ein Java-Servlet entwickelt, welchem man eine beliebige Anzahl von "Komponenten" übergeben kann, und welches im Gegenzug alle im Zusammenhang mit diesen Komponenten stehenden JavaScripte und CSS ausliefert. Praktisch sieht das so aus, dass wir zu dem ursprünglichen Ansatz zurückgekehrt sind, über ein XSLT-Template festzulegen, welche Komponenten auf welcher Seite in welchem Modus (Entwicklungsumgebung, Liveumgebung oder beides) komprimiert oder unkomprimiert ausgeliefert werden sollen. Das Template verkettet die entsprechenden Komponenten und generiert nur noch genau ein Link- und ein Script-Element um alle auf der Seite benötigten Styles und Scripte zu laden.
<script type="text/javascript" src="http://nicosteiner.de/xml/jasmin/js-min/pweborder-de+autocompletion" />
<link type="text/css" href="http://nicosteiner.de/xml/jasmin/css-min/pweborder-de+autocompletion" />
Die erwähnten Komponenten bestehen aus frei wählbaren Ressourcen, welche aus dem lokalen Dateisystem, über HTTP-Requests oder aus Maven heraus bezogen werden können und welche beliebig untereinander Abhängigkeiten definieren können.
Nachdem dieses Servlet bereits bei Pocket Web und anderen 1&1-Shops im Einsatz ist, besteht die Herausforderung nun darin, ein möglichst intelligentes Caching zu entwickeln.
Laden von JavaScript und CSS - Teil 2
Die Überschneidung von Ressourcen in verschiedenen Modulen, wie sie in Teil 1 beschrieben wurden, forderten eine elegantere Lösung des Einbindens externer Ressourcen. Eine Lösung des Problems schien das YUI Loader Utility zu bieten. Wie bei YAHOO! zu lesen ist, bietet dieses Utility die Möglichkeit, unterhalb der Module definierte Abhängigkeiten aufzulösen und die entsprechenden Ressourcen zum richtigen Moment genau einmal zu laden.
Dies funktioniert auch wie versprochen. Der große Nachteil von dieser Lösung besteht darin, daß jede beteiligte Ressource als einzelne Datei geladen wird, was zum Teil zu enorm vielen Server-Requests führt. Möchte man diesen Umstand vermeiden, also alle beteiligten Dateien in der richtigen Reihenfolge automatisiert über einen zu Request laden, stellt auch das YUI Loader Utility keine Option dar.
Laden von JavaScript und CSS - Teil 1
Die Idee, die als Motivation dieser Arbeit diente, war die, daß es möglich sein müßte, externe Ressourcen wie JavaScript und CSS nur den Seiten zuzuordnen, die diese auch wirklich benötigen.
Die erste Lösung bestand darin, mittels XSLT eine Konfiguration vorzugeben, welche einer einzelnen oder mehreren Seiten bestimmte Ressourcen in Form von Modulen zuteilen. Also etwa in der Art:
<page name="Home">
<module>yui-animation</module>
<module>local-css</module>
</page>
Wobei ein Modul dann folgendermaßen aussieht:
<module name="yui-animation">
<script>yui/yahoo/yahoo-min.js</script>
<script>yui/dom/dom-min.js</script>
<script>yui/event/event-min.js</script>
<script>yui/animation/animation-min.js</script>
</module>
Dies funktioniert gut, solange sich keine Ressource eines eingebundenen Moduls mit der eines anderen Moduls überschneidet. In diesem Fall würde es dazu kommen, daß Ressourcen doppelt oder sogar öfter eingebunden werden. Da sich in der Praxis jedoch gezeigt hat, daß dies bei komplexeren Seiten ständig der Fall ist, mußte eine Lösung her, die zusätzlich zur Definition der Module auch ein intelligentes Management der Abhängigkeiten der Module untereinander und deren korrekte Auflösung ermöglichte.
Archive
- September 2010 (1)
- August 2010 (3)
- Juli 2010 (2)
- Juni 2010 (3)
- Mai 2010 (9)
- April 2010 (8)
- März 2010 (13)
- Februar 2010 (10)
- Januar 2010 (11)
- Dezember 2009 (8)
- November 2009 (6)
- Oktober 2009 (10)
- September 2009 (9)
- August 2009 (12)
- Juli 2009 (16)
- Juni 2009 (17)
- Mai 2009 (8)
- April 2009 (12)
- März 2009 (8)
- Februar 2009 (10)
- Januar 2009 (9)
- Dezember 2008 (2)
- November 2008 (8)
- Oktober 2008 (13)
- September 2008 (3)
- August 2008 (5)
- Juli 2008 (9)
- Juni 2008 (5)
- Mai 2008 (5)
- April 2008 (7)
- März 2008 (2)
- Das Neueste ...
- Älteres ...