GZIP Komprimierung, Aktivierung und Erklärung

Letzte Aktualisierung : |  

Apache Server haben bereits das GZIP Kompressionsprogramm integriert und man muss es nur noch aktivieren. Mit der htaccess ist die Aktivierung in ein paar schritten schnell erledigt und Dein GZIP ist aktiviert. Der Vorteil ist das man komprimierte Dateien schneller ausgeliefert bekommt. Dazu gibt es viele Wege jedoch möchte ich hier die htaccess Variante vorstellen.



Warum GZIP nutzen ?

Du sparst damit jede menge an Daten die Übertragen werden, da die Daten stark komprimiert werden bei der Ausgabe. Die Verarbeitung kostet dem Server natürlich Zeit, jedoch geschieht das sehr schnell, so das man es mit einem durchschnittlichen Webspaces nicht einmal wahr nimmt. Du sollt es also die Komprimierung deines Server nutzen um auch bei Speed Test Tools gute Ergebnisse erzielst. Zum Beispiel bei Google Page Speed oder auch Think with Google für Mobile Geräte.



Aktivierung mit der htaccess

Für uns ist hier an erster stelle die DEFLATE (Algorithmus) wichtig, zur Erklärung das ist GZIP Kodierung aus zwei teilen, LZ77 und Huffman-Kodierung. Hier können wir für alle Applikationen ein AddOutputFilterByType einsetzen um sie bei der Ausgabe zu Komprimieren. Du kannst die GZIP in der Apache Konfigurationsdatei aktivieren doch sie sollte standard bereits aktiviert sein. Rufe die Konfigurationsdatei in deiner Konsole (Terminal) auf. Und das alles könnte wie folgt aussehen .


USERNAME$ nano /etc/httpd/conf/httpd.conf
# Deactivated
# LoadModule deflate_module modules/mod_deflate.so

# Activated
LoadModule deflate_module modules/mod_deflate.so

 mod DEFLATE

// HTACCESS CODE
     0  # MBT BEGIN GZIP  1  <IFModule mod_deflate.c>  2  SetOutputFilter DEFLATE  3  # Compress HTML, CSS, JavaScript, Text, XML and fonts  4  AddOutputFilterByType DEFLATE application/javascript  5  AddOutputFilterByType DEFLATE application/rss+xml  6  AddOutputFilterByType DEFLATE application/atom_xml  7  AddOutputFilterByType DEFLATE application/vnd.ms-fontobject  8  AddOutputFilterByType DEFLATE application/x-font  9  AddOutputFilterByType DEFLATE application/x-font-opentype  10  AddOutputFilterByType DEFLATE application/x-font-otf  11  AddOutputFilterByType DEFLATE application/x-font-truetype  12  AddOutputFilterByType DEFLATE application/x-font-ttf  13  AddOutputFilterByType DEFLATE application/x-javascript  14  AddOutputFilterByType DEFLATE application/x-shockwave-flash  15  AddOutputFilterByType DEFLATE application/xhtml+xml  16  AddOutputFilterByType DEFLATE application/xml  17  AddOutputFilterByType DEFLATE image/svg+xml  18  AddOutputFilterByType DEFLATE image/x-icon  19  AddOutputFilterByType DEFLATE image/icon  20  AddOutputFilterByType DEFLATE image/x-ico  21  AddOutputFilterByType DEFLATE image/ico  22  AddOutputFilterByType DEFLATE image/jpeg  23  AddOutputFilterByType DEFLATE image/gif  24  AddOutputFilterByType DEFLATE image/png  25  AddOutputFilterByType DEFLATE text/css  26  AddOutputFilterByType DEFLATE text/html  27  AddOutputFilterByType DEFLATE text/javascript  28  AddOutputFilterByType DEFLATE text/plain  29  AddOutputFilterByType DEFLATE text/xml  30  AddOutputFilterByType DEFLATE text/json  31  AddOutputFilterByType DEFLATE text/php  32  AddOutputFilterByType DEFLATE font/opentype  33  AddOutputFilterByType DEFLATE font/otf  34  AddOutputFilterByType DEFLATE font/ttf  35  # Remove browser bugs (only needed for really old browsers)  36  BrowserMatch ^Mozilla/4 gzip-only-text/html  37  BrowserMatch ^Mozilla/4\.0[678] no-gzip  38  BrowserMatch \bMSIE !no-gzip !gzip-only-text/html  39  Header append Vary Accept-Encoding  40  </IFModule>  41  # MBT END GZIP 

    Somit haben wir fast alle Dateitypen mit aufgenommen um sie bei der Ausgabe zu Komprimieren per GZIP. Du solltest alle Dateien stehen haben in der Auflistung damit sie komprimiert werden. Weiter unten findest Du auch ein Tool um zu checken ob die Komprimierung nun greift, am besten Du testes es erstmal ohne und dann mit. Ich bin mir zu 100% Sicher das es funktioniert und Du danach auch gleich mit Google Page Speed bessere Ergebnisse erzielen wirst ;).



    Browsercache setzen und nutzen

    Wenn Du nun die GZIP aktiviert hast, können wir noch das Ablaufdatum für unsere Applikationen setzen und so den Browser Cache nutzen. Das bringt uns nochmal ein kleinen Vorteil an speed und wir werden besser bewertet.



    Genutzter Browser Cache

    // HTACCESS CODE
       0  # MBT BEGIN BROWSERCACHE  1  # Bilder und andere Ressourcen können großzügig gecacht werden HTML lieber nicht  2  <IFModule mod_expires.c>  3  ExpiresActive ON  4  # Perhaps better to whitelist expires rules? Perhaps.  5  ExpiresDefault                          	"access plus 60 seconds"  6  # cache.appcache needs re-requests in FF 3.6 (thx Remy ~Introducing HTML5)  7   ExpiresByType text/cache-manifest              "access plus 60 seconds"  8  # your document html   9   ExpiresByType text/html                        "access plus 0 seconds"  10  # data  11  ExpiresByType text/xml                  	"access plus 60 seconds"  12  ExpiresByType application/xml           	"access plus 60 seconds"  13  ExpiresByType application/json          	"access plus 60 seconds"  14  # rss feed  15  ExpiresByType application/rss+xml       	"access plus 60 seconds"  16  # favicon (cannot be renamed)  17  ExpiresByType image/x-icon              	"access plus 1 month"   18  # media: images, video, audio  19  ExpiresByType image/gif                 	"access plus 1 month"  20  ExpiresByType image/png                 	"access plus 1 month"  21  ExpiresByType image/jpg                 	"access plus 1 month"  22  ExpiresByType image/jpeg                	"access plus 1 month"  23  ExpiresByType image/icon                        "access plus 1 month"  24  ExpiresByType image/svg+xml                     "access plus 1 month"  25  ExpiresByType video/ogg                	 	"access plus 1 month"  26  ExpiresByType audio/ogg                 	"access plus 1 month"  27  ExpiresByType video/mp4                 	"access plus 1 month"  28  ExpiresByType video/webm                	"access plus 1 month"  29  # htc files  (css3pie)  30   ExpiresByType text/x-component                 "access plus 1 month"  31  # webfonts  32  ExpiresByType font/truetype             	"access plus 1 month"  33  ExpiresByType font/opentype             	"access plus 1 month"  34  ExpiresByType application/x-font-woff   	"access plus 1 month"  35  ExpiresByType application/vnd.ms-fontobject     "access plus 1 month"  36  ExpiresByType application/x-ico                 "access plus 1 month"  37  ExpiresByType application/ico                   "access plus 1 month"  38  # css and javascript  39  ExpiresByType text/css                  	"access plus 1 month"  40  ExpiresByType text/javascript           	"access plus 1 month"  41  ExpiresByType application/javascript    	"access plus 1 month"  42  ExpiresByType application/x-javascript          "access plus 1 month"  43  </IFModule>  44  # MBT END BROWSERCACHE 

      Nun haben wir die komplette palette an Browser Cache angewendet, ich bin mit diesen Einstellungen immer gut gefahren und deshalb nicht mehr wirklich dran geschraubt, obwohl ich der Meinung bin das man noch mehr rausholen kann. Also wenn Du eine Idee hast oder auch eine konkrete Lösung immer gerne her damit.



      Wenn Du WordPress verwendest dann setzte beide Codeschnipsel über die WordPress Codeschnipsel.


      Testen der GZIP Komprimierung

      Hast Du alles in Deine htaccess hinzugefügt so kannst Du nun auch testen ob wirklich alles greift und etwas komprimiert wird. Hier kannst Du sehen wieviel es sind wenn es Komprimiert ist und wieviel wenn es nicht Komprimiert wäre und noch vieles mehr.
       Test GZIP

      Nun wenn Dein GZIP jetzt greift, was zu 100% mit diesen beiden oben vorgestellten Lösungen zutreffen sollte, weil ich mir sehr sicher bin das es bei jedem der es anwendet etwas bringt. Dann hast Du es geschafft und hast Dein GZIP erfolgreich aktiviert.

      Anzeige

      Dein Kommentar

      * Diese Felder sind erforderlich, E-Mails werden nicht veröffentlicht
      ?

      Dieses Feld ist optional
      Fülle dieses Feld aus und verbinde Dein Namen mit Deiner Website.

      Die in dieses Kontaktformular eingegebenen Daten werden in unserem System gespeichert, um die Ausgabe des Kommentars sicherzustellen. Ihre E-Mail-Adresse wird gespeichert, um die Anzahl der Kommentare und die zukünftige Registrierung zu bestimmen

      Ich habe gelesen die Datenschutzbestimmungen und Nutzungsbedingungen. Ich bestätige die Übermittlung des Formulars und die Übermittlung meiner Daten.
      tnado © 2019 | Alle Rechte Vorbehalten
      In Zusammenarbeit mit Hyperly