Ansätze zur Minimierung von js und css in Grails-Anwendungen

8

Ich arbeite daran, js und css-Dateien in der grails-Anwendung zu verkleinern. Mein ursprünglicher Plan ist es, das Ressourcen-Plugin zu verwenden, um die Ressourcen zu minimieren (habe auch einen Blick auf Jaehr und Performance-Ui geworfen, aber Ressourcen scheinen in diesen Tagen de facto Standard zu sein).

Resources macht es einfach, einzelne CSS-Dateien mit YUI zu minimieren, aber wir haben über 40 JS-Dateien, die wir zu einer einzigen Datei verketten möchten (und die Dateien müssen in der richtigen Reihenfolge verkettet werden) I Ich habe nichts gesehen, was darauf hindeutet, dass Resources dies von Anfang an unterstützt. Dies sind die Ansätze, die wir bisher geplant haben:

  1. Add new grails taglib zum Verketten der js und css Dateien, um eine js und eine css Datei zu erstellen und minify mit dem Ressourcen-Plugin. Eine naive Implementierung bedeutet, dass yui-minify jedes Mal ausgeführt wird, wenn die Seite bedient wird (!!), so dass wir Caching irgendwie einführen müssen.

  2. Verwende die rouils.war.resources von BuildConfig, um js und css zu minimieren. Dies würde das Caching-Problem umgehen, da die Ressource zur Build-Zeit nur gebaut und minimiert werden würde, aber wir müssen Grails Run-War verwenden, um lokal zu testen, daher werden alle Fehler, die die Verminung betreffen, erst später im Dev gefangen Zyklus.

Dies muss ein ziemlich häufiges Problem sein. Was machen andere Leute? Möchte gerne etwas über andere Ansätze oder Best Practices erfahren, die ich verwenden kann.

    
Kasun Mathota 14.03.2013, 12:32
quelle

1 Antwort

1

Sie können alle Ihre Ressourcen mit demselben Bundle erstellen. Damit haben Sie nur eine zusammengeführte js. Beispiel:

%Vor%

Laut den Dokumenten:

  

Der "bundle" -Mapper addiert Ressourcen desselben Typs zusammen, um sie zu reduzieren   die Anzahl der Dateien, die von Ihren Client-Seiten angefordert werden.

     

Der "bundle" -Mapper betrachtet den Wert der "bundle" -Eigenschaft an   Ressourcen, und wenn sie gefunden werden, wird die Ressource zu einem neuen synthetischen hinzugefügt   aggregierte Ressource.

     

Diese aggregierte Ressource wird selbst über Mapper verarbeitet   vorbehaltlich der anderen Optimierungen, die Sie auf die Art der Ressource anwenden   Das Bündel aggregiert.

     

Bundles befinden sich immer im Basisverzeichnis der statischen Ressourcen   Ordner - was bedeutet, dass Verweise auf Dateien innerhalb des Pakets sein müssen   so angepasst, dass sie weiterhin auf die gleichen Dateien verweisen. Das ist gemacht   möglich für CSS-Dateien durch die csspreprocessor und cssrewriter Mapper.

    
Sérgio Michels 14.03.2013, 12:50
quelle

Tags und Links