Ansätze, um js und css in Grails Anwendungen zu minimieren

Question

Ich arbeite an der Verkleinerung js und CSS-Dateien in Grails-Anwendung. Mein ursprünglicher Plan ist es, das Ressourcen-Plugin zu verwenden, um die Ressourcen zu minimieren (ich habe auch einen Blick auf Jawr 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) ich habe nichts gesehen, was darauf hindeutet, dass Ressourcen dies aus der Box unterstützt, das sind die Ansätze, die wir bisher geplant haben:

1. hinzufügen grails tagLib die js und CSS-Dateien verketten, um eine js zu erstellen und eine CSS-Datei und minimieren Sie 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. Verwenden Sie die grals.war.resources von BuildConfig, um die 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 Verminerung 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.

Answer 1

Sie können alle Ihre Ressourcen mit dem gleichen Bundle machen, mit diesem werden Sie nur eine zusammengeführte js haben. Beispiel:

main { 
    resource id: 'mainjs', url: 'js/main.js' 
    defaultBundle: 'mybundle' 
} 

second { 
    resource id: 'secondjs', url: 'js/second.js' 
    defaultBundle: 'mybundle' 
} 

Nach der Dokumentation:

Das „Bündel“ Mapper fügt zusammen Ressourcen des gleichen Typs die Anzahl der Dateien, um Ihre Client-Seiten aufrufen zu reduzieren.

Der "Bündel" -Mapper betrachtet den Wert der "Bundle" -Eigenschaft auf Ressourcen und wenn gefunden, wird die Ressource zu einer neuen synthetischen aggregierten Ressource hinzufügen.

Diese aggregierte Ressource wird selbst durch Mapper verarbeitet, daher ist sie abhängig von den anderen Optimierungen, die Sie auf die Art der Ressource anwenden, die das Bündel aggregiert.

Bundles befinden sich immer im Basisverzeichnis des statischen Ordners - was bedeutet, dass Verweise auf Dateien innerhalb des Bundles neu angepasst werden müssen, damit sie weiterhin auf die gleichen Dateien verweisen. Dies ist möglich gemacht für CSS-Dateien durch die csspreprocessor und cssrewriter Mapper.