Wie kann ich meine mimifizierten .js- und .css-Dateien vor der Veröffentlichung in AWS S3 komprimieren / gzipieren?

8

Ich habe Google pagespeed ausgeführt und schlägt vor, meine .js und .css zu komprimieren

Beseitigen Sie JavaScript und CSS, die das Rendering blockieren, in überfalteten Inhalten Zeigen Sie, wie Sie beheben können

%Vor%

Während meiner Veröffentlichung habe ich einen Schritt, der Windows Powershell verwendet, um ein .js und .css mimified Bundle nach S3 zu verschieben, und das geht an cloudfront.

Gibt es einen Schritt, den ich im PowerShell-Skript hinzufügen könnte, um die .js- und .css-Dateien zu komprimieren?

Auch wenn die Dateien komprimiert sind, muss ich mehr tun, als den Namen zu ändern, um meinem Browser mitzuteilen, dass er eine gzip-Datei versuchen und akzeptieren muss?

    
Melina 19.05.2015, 03:41
quelle

3 Antworten

6

Sie können zu Ihrem Upload-Skript den benötigten Code hinzufügen, um die Dateien zu komprimieren.

Ein Beispielcode könnte dies sein:

%Vor%

Von dieser Site: Gzip-Erstellung in Powershell

    
Diego F. Durán 21.05.2015, 11:18
quelle
6

Powershell-Community-Erweiterungen haben einen Scriptlet zum Greifen von Dateien und es ist sehr einfach zu verwenden:

%Vor%

Sie müssen Ihre Dateien nicht umbenennen, fügen Sie einfach einen Content-Encoding Header hinzu und setzen Sie ihn auf gzip .

    
MatteoSp 21.05.2015 23:17
quelle
0

Da Amazon S3 nur statische Dateien bereitstellen soll, werden Dateien (Assets) nicht komprimiert, deshalb müssen Sie sie selbst komprimieren:

  • Komprimiere deine .js und .css mit gzip: Ich weiß nicht, wie ich mit PowerShell umgehen soll, aber mit Python schlage ich vor, ein Python-Deployment-Skript zu erstellen (besser noch ein fabfile ) und integrieren Sie den Kompressions- und Push-Code darauf.

  • "Auch wenn die Dateien komprimiert sind, muss ich noch mehr tun, als den Namen zu ändern, um meinem Browser mitzuteilen, dass er versuchen muss, eine gzip-Datei zu akzeptieren?" : Gute Fragen! Es ist nicht notwendig, den Namen der komprimierten Datei zu ändern, ich rate nicht umbenennen. Sie jedoch:

  • MUSS auch die Kopfzeile "Content-Encoding: gzip" setzen, sonst kennen die Browser die Datei nicht.

  • Geben Sie die Kopfzeilen 'Content-Type' an: type (type = 'application / javascript' oder 'text / css')

  • Sie müssen die Kopfzeile 'x-amz-acl': 'public-read' setzen, um sie öffentlich zugänglich zu machen.

  • Ich empfehle auch, den Header "Cache-Control: max-age = TIME" zu setzen (Beispiel: TIME = 31104000, für 360 Tage): Um den Browser beim Zwischenspeichern zu unterstützen (bessere Leistung)

Dies funktioniert, egal ob vom Ursprung oder mit Cloudfront. Aber denken Sie daran, wenn Sie sie mit Cloudfront bereitstellen, müssen Sie alle Dateien nach jedem Push ungültig machen, sonst wird die alte Version bis zu 24 Stunden nach dem Push leben. Hoffe, das hilft, ich kann eine Python-Lösung bei Bedarf bereitstellen.

    
Yahya Yahyaoui 28.05.2015 08:53
quelle