Hilfe mit gzip Kompression?

sepp88 · #1 (**permalink**) 09.05.2011, 09:39

Hallo Leute,
ich bastle schon eine Weile an einer aufwändigen (javascript-lastigen) Webseite die ich diese Woche fertigstellen werde.

Mir kommt vor die Seite lädt nicht ganz so schnell wie ich mir das erhofft hatte. Das kann möglicherweise daran liegen, dass ich so viele Script Bibliotheken und Plugins verwende. Zumindest bestätigt das "Page Speed" von Google Chrome.

Zitat:

Die Komprimierung der folgenden Ressourcen mit gzip könnte ihre Übertragungsgröße um 219.2 KiB verringern (Reduzierung um 50 %).

Ich habe jetzt zwar einiges gelesen aber würde trotzdem gerne eine direkte Meinung/Antwort von euch hören.

Wie genau verwende ich gzip?

Die tolle Seite Merge, Minify, and GZip Compress JS & CSS, online tool würde mir alle meine js files als komprimierte, g-gezipp-te Datei liefern.

Muss ich einfach nur als javascript .src dieses File angeben?
Ich verwende derzeit "head.js" um meine Bibliotheken möglichst performant zu handlen.

Ich verwende...

PHP-Code:


			
    <script type="text/javascript">
    var path = "<?php bloginfo('template_directory'); ?>";
    
    head.js( path + "/js/jquery-1.6.min.js", path + "/js/jquery.easing.1.3.js", path + "/js/jquery.highlight-3.js", path + "/js/jquery-color.js", path + "/js/jquery-cookie.js", path + "/js/jquery.backgroundPosition.js", path + "/js/scripts.js", function() { });
    </script>

Das sind natürlich einige Bibliotheken und Plugins, aber die sind für mein Projekt unbedingt notwendig.

Ich würde einfach gerne meine Seite noch weiter optimieren und schneller machen. Ich verwende CSS Sprites, caching etc. nur die Scripts und CSS-Files sind noch nicht optimiert.

Was könnt ihr da vorschlagen?
Danke

philosapiens · #2 (**permalink**) 09.05.2011, 12:22

Hallo,

ich komprimiere frei nach Fritz:

Seiten noch schneller machen - CSS mit mod_gzip komprimieren - Blog von webdesign.weisshart.de

Das geht auch mit JavaScript-Dateien:
in der htaccess:

Code:

<Files file.js>
ForceType application/x-httpd-php
</Files>

und in der file.js

Code:

<?php 
ob_start('ob_gzhandler');
header('Content-type: text/javascript;');
?>

Klappt bei mir ganz prima und PageSpeed scheint es zu gefallen.

sepp88 · #3 (**permalink**) 09.05.2011, 12:50

Danke, und das ist alles?

Ich brauche nur diese paar Zeilen adden und schon wird komprimiert? Oder muss ich die Zeilen hinzufügen und schon selbst noch die Files komprimieren und auf den Server stellen?

philosapiens · #4 (**permalink**) 09.05.2011, 13:12

Hallo,

also ich habe meine lesbar gelassen und nur mit gzip komprimiert. Wenn Du noch mehr raus quetschen möchtest, mach doch einfach beides. Schlanker geht 's dann wohl nimmer.

sepp88 · #5 (**permalink**) 09.05.2011, 15:33

Danke, soll die htaccess Datei im selben Verzeichnis liegen wie file.js? Sonst müsste ja wohl die Pfadangabe angepasst werden oder?

PHP-Code:


			
<Files pfad/zu/file.js>
ForceType application/x-httpd-php
</Files>

Wenn ich in meine script.js Datei folgendes schreibe...

PHP-Code:


			
<?php 
    ob_start('ob_gzhandler');
    header('Content-type: text/javascript;');
?>

//JQUERY
$.extend($.expr[':'], {
    // case insensitive version of :contains
    icontains: function(a,i,m){return (a.textContent||a.innerText||jQuery(a).text()||"").toLowerCase().indexOf(m[3].toLowerCase())>=0;}
});

...

und ein .htaccess Datei im selben Verzeichniss anlege die

PHP-Code:


			
<Files scripts.js>
ForceType application/x-httpd-php
</Files>

dann meldet meine console nur Fehler. "unexpected <" ...

David · #6 (**permalink**) 09.05.2011, 16:27

Was ist denn bitte mod_gzip? Ich kannte bisher nur mod_deflate und das macht genau das was es soll, ohne erst CSS-Dateien durch den PHP-Parser zu jagen

Ist das Modul nicht verfügbar, oder will man die Dateien schon vorher manuell komprimieren (geht auch super mit 7zip), dann reicht auch ein Rewrite:

Code:

RewriteEngine On
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME}.jgz -f
RewriteRule (.*)\.js$ $1.js.jgz [L]
AddType "text/javascript" .js.jgz
AddEncoding gzip .jgz

sepp88 · #7 (**permalink**) 09.05.2011, 17:37

Hallo David,
muss ich einfach nur diese paar Zeilen Code in meiner htaccess Datei einfügen und schon sollte komprimiert werden, oder?

Denn wenn ich das in meiner .htaccess (im Root Verzeichnis) einfüge, ändert sich scheinbar garnichts. Zumindest "Page Speed" in Google Chrome ist bei "Komprimierung verwenden" immer noch rot!

PHP-Code:


			

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress

RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME}.jgz -f
RewriteRule (.*)\.js$ $1.js.jgz [L]
AddType "text/javascript" .js.jgz
AddEncoding gzip .jgz

philosapiens · #8 (**permalink**) 09.05.2011, 18:29

Hallo,

ja, die .htaccess liegt bei mir immer mit im Verzeichnis der script.js und es klappt.

David · #9 (**permalink**) 09.05.2011, 18:31

Wie ich geschrieben habe, handelt es sich um eine Umleitung auf eine bereits komprimiert vorliegende Variante einer angefragten Resource:

Zitat:

Zitat von David

Was ist denn bitte mod_gzip? Ich kannte bisher nur mod_deflate […]

Ist das Modul nicht verfügbar, oder will man die Dateien schon vorher manuell komprimieren (geht auch super mit 7zip), dann reicht auch ein Rewrite:[…]

Mod_Deflate ist das entprechende Apache Modul, welches z.B. bestimmte Dateitypen vor dem Versenden komprimiert.

sepp88 · #10 (**permalink**) 09.05.2011, 19:12

Das heißt ich muss manuell meine js files mit gzip komprimieren und dann wird mit diesem mod-deflate Script auf die komprimierte Version umgeleitet.

Wie schaut es aus mit .css Dateien?

Wie müsste der Dateinamen auf den umgeleitet wird lauten. Ich habe leider große Schwierigkeiten den htaccess Code zu verstehen.

"jquery-1.6.min.js" zu "jquery-1.6.min.js.jgz" ??? Stimmt das?
Mit welchem Programm kann ich Dateien in .jgz umwandeln?

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Bitte um Hilfe Anfänger google Bild url weiterleiten	peterwill	Serveradministration und serverseitige Scripte	1	28.04.2011 15:17
HILFE Menüleiste nicht mehr sichtbar bei Mozilla und Safari	LittleStep	Javascript & Ajax	1	01.12.2009 20:39
HILFE, ich brauche Hilfe von Profis!	frambuesa	CSS	13	13.06.2008 22:46
hilfe bzw anregung bezüglich code und aufbau	flow	CSS	0	23.11.2005 16:13
frage zu gzip	hyperterminal	Serveradministration und serverseitige Scripte	11	16.04.2005 13:38