Optimieren der WordPress-Ladegeschwindigkeit mit header.php & .htaccess

Das Laden von Webseiten ist für jeden Blog / jede Website von großer Bedeutung, insbesondere für Personen mit Shared Hosting - der billigste verfügbare Hosting-Service. Hier sind ein paar .htaccess und header.php Tricks, um die Ladegeschwindigkeit Ihrer Website um 50-70% zu erhöhen


Die Webperformance erlangt immer mehr Aufmerksamkeit von Webentwicklern und ist eines der heißesten Themen in der Webentwicklung. In erster Linie ist die Ladegeschwindigkeit mehr als eine Funktion. Geschwindigkeit ist das wichtigste Merkmal. Wenn Ihre Website oder Ihr Blog langsam ist, wird sie nicht verwendet.

Was Geschwindigkeit für Internet-Giganten bedeutet:

  • Für Google - 500 Millisekunden zusätzliche Ladezeit verursachten 20% weniger Suchanfragen
  • Für Yahoo - 400 Millisekunden zusätzliche Ladezeit verursachten 5-9% mehr Personen, die vor dem Laden der Seite auf "Zurück" geklickt hatten
  • Bei Amazon führte eine zusätzliche Ladezeit von 100 Millisekunden zu einem Umsatzrückgang von 1%

Google hat in seinem fortwährenden Bemühen, das Internet zu beschleunigen, gebloggt, dass "wir beschlossen haben, die Website-Geschwindigkeit in unseren Suchrankings zu berücksichtigen."

Eine langsamere Website verringert also auch Ihr Suchmaschinenranking.

Die Ladegeschwindigkeit ist also sehr wichtig. CDN (Content Delivery System) ist für diesen Zweck ziemlich gut, aber bis zu einem gewissen Grad und gute CDN-Anbieter sind ein wenig teuer.

Die gute Nachricht ist, dass einige der wichtigsten Geschwindigkeitsoptimierungen problemlos mit einfach durchgeführt werden können .htaccess Tricks Diese können das Laden von Websites beschleunigen, indem Inhalte komprimiert und das Zwischenspeichern von Browsern aktiviert werden. Außerdem folgen sie den Best Practices für die Beschleunigung Ihrer Website vom Yahoo! Exceptional Performance-Team und kosten keinen Cent.


Schritt 1 Gzip-Dateikomprimierung

Durch die Komprimierung werden Antwortzeiten reduziert, indem die Größe der HTTP-Antwort reduziert wird.

Es lohnt sich, Ihre HTML-Dokumente, Skripte und Stylesheets zu komprimieren. Tatsächlich lohnt es sich, alle Textantworten einschließlich XML und JSON zu komprimieren.

Bild- und PDF-Dateien sollten nicht komprimiert werden, da sie bereits komprimiert sind. Beim Versuch, sie zu komprimieren, wird nicht nur die CPU verschwendet, sondern es kann auch die Dateigröße erhöht werden.

Durch die Dateikomprimierung wird auch etwas Bandbreite eingespart.

Mit .htaccess

  • Für Apache-Server

    mod_pagespeed ist ein von Google entwickeltes Apache-Modul. Die Befehlsanweisung kann wie andere Module verwendet werden.

    Derzeit unterstützen nur GoDaddy und DreamHost das mod_pagespeed Wenn Sie also mit ihnen hosten, kopieren Sie den folgenden Code und fügen Sie ihn in Ihr ein .htaccess Datei:

      ModPagespeed on # mit Befehlen, Filtern usw 

    Viele von Ihnen hosten möglicherweise bei anderen Hosting-Anbietern, die das nicht unterstützen mod_pagespeed Modul.

    Du kannst den ... benutzen mod_deflate Modul (Apache 1.3x verwendet) mod_gzip aber seit Apache 2x mod_deflate wird eingesetzt)

      AddOutputFilterByType DEFLATE text / html text / plain text / XML-Anwendung / XML-Anwendung / Xhtml + XML-Text / CSS Text / Javascript-Anwendung / Javascript-Anwendung / X-Javascript 
  • Für Nginx Server

    Wenn Sie sich auf einem Nginx-Webserver befinden, kopieren Sie Folgendes auf Ihren .htaccess gzip-Komprimierung aktivieren.

     Server gzip on; gzip_types text / html text / css anwendung / x-javascript text / einfacher text / xml image / x-icon; 

Mit header.php

Wenn Ihr Server nicht unterstützt mod_deflate oder mod_gzip Sie können dieses PHP-Skript für die gzip-Komprimierung verwenden, die sowohl für Apache als auch für Nginx funktioniert

Kopieren Sie dies einfach in Ihr Theme header.php

 

Unten sehen Sie das Balkendiagramm, das die Ladegeschwindigkeit meiner Website ohne und mit GZIP-Komprimierung zeigt.


Schritt 2 Deaktivieren Sie ETags

ETags (Entity Tags) sind ein Mechanismus, den Webserver und Browser verwenden, um festzustellen, ob die Komponente im Cache des Browsers mit dem ursprünglichen Server übereinstimmt. Etags werden hinzugefügt, um einen Mechanismus zum Überprüfen von Entitäten bereitzustellen, der flexibler ist als das Datum der letzten Änderung. Ein ETag ist eine Zeichenfolge, die eine bestimmte Version einer Komponente eindeutig identifiziert. Die Einschränkungen dieses Formats bestehen darin, dass die Zeichenfolge in Anführungszeichen steht. Der Ursprungsserver gibt den ETag der Komponente mithilfe des ETag-Antwortheaders an.

Um ETags zu deaktivieren, fügen Sie dies in Ihr ein .htaccess Datei

 Header nicht gesetzt ETag FileETag Keine

Schritt 3 Verwenden Sie die Browser-Zwischenspeicherung

Beim Browser-Caching weisen wir explizit an, dass Browser bestimmte Dateien für einen bestimmten Zeitraum beibehalten. Wenn die Datei erneut benötigt wird, muss der Browser aus dem lokalen Cache ziehen, anstatt sie erneut vom Server anzufordern.

Wenn Sie eine Website ohne Zwischenspeicherung ausführen, ist es genauso sinnvoll, bei jedem Durst ein Glas Wasser in den Laden zu fahren. Es ist nicht nur unpraktisch und kurzsichtig, es erfordert auch mehr Arbeit!

Browser-Caching ist wirklich nützlich, um wiederkehrende Benutzer zu erhalten. Das bedeutet, dass Sie treue permanente Besucher für Sie gewinnen können und außerdem viel Bandbreite sparen.

Wenn Sie zum ersten Mal Ihre Seite besuchen, werden mehrere HTTP-Anforderungen zum Herunterladen aller Dateien Ihrer Site gestellt. Durch die Verwendung der Header "Expires" und "Cache-Control" können Sie diese Dateien jedoch in den Cache speichern. Dadurch werden unnötige HTTP-Anforderungen für nachfolgende Seitenaufrufe vermieden.

  • Für Apache-Server

    Apache ermöglicht durch die mod_expires und mod_headers Module.

    Das mod_expires Das Modul steuert die Einstellung des Expires-HTTP-Headers und der Max-Age-Direktive des Cache-Control-HTTP-Headers in Serverantworten. Um andere Cache-Control-Anweisungen als max-age zu ändern, können Sie die mod_headers Modul.

    Das mod_headers Das Modul enthält Anweisungen zum Steuern und Ändern von HTTP-Anforderungs- und Antwort-Headern. Header können zusammengefügt, ersetzt oder entfernt werden.

    Fügen Sie diese Regeln hinzu .htaccess zum Setzen von Expires-Headern:

     # BEGIN Expire-Header  ExpiresActive On ExpiresDefault "Zugriff plus 5 Sekunden" ExpiresByType image / x-icon "Zugriff plus 2592000 Sekunden" ExpiresByType Image / jpeg "Zugriff plus 2592000 Sekunden" ExpiresByType Image / png "Zugriff plus 2592000 Sekunden" ExpiresByType Image / Gif "Zugriff plus 2592000 Sekunden "ExpiresByType-Anwendung / x-shockwave-flash" Zugriff plus 2592000 Sekunden "ExpiresByType Text / CSS" Zugriff plus 604800 Sekunden "ExpiresByType Text / Javascript" Zugriff plus 216000 Sekunden "ExpiresByType Anwendung / Javascript" Zugriff plus 216000 Sekunden "ExpiresByType-Anwendung / x- Javascript "Zugriff plus 216000 Sekunden" ExpiresByType Text / HTML "Zugriff plus 600 Sekunden" ExpiresByType Anwendung / Xhtml + XML "Zugriff plus 600 Sekunden"  # END Kopfzeilen verfallen

    .htaccess Regeln zum Einrichten des Cache-Control-Headers:

     # BEGIN Cache-Control-Header   Header-Set Cache-Control "public"   Header-Set Cache-Control "public"   Header-Set Cache-Control "privat"   Header-Set Cache-Control "privat, must-revalidate"   # END Cache-Control-Header

    Hinweis:

    1. Es ist nicht nötig, das einzustellen Maximalalter Direktive mit dem Cache-Control-Header, da er bereits vom gesetzt ist mod_expires Modul.
    2. Muss revalidieren bedeutet, dass eine Antwort, wenn eine Antwort veraltet ist, erneut validiert werden muss; es bedeutet nicht, dass es jedes Mal überprüft werden muss.
  • Für NGINX-Server

    Die entsprechende .htaccess Einstellungen in Nginx würden ungefähr so ​​aussehen:

    (Das folgende Beispiel würde den Browsern Ihrer Besucher anweisen, sich eine Stunde lang an HTML, CSS, Javascript, Bildern und Favicon zu halten.)

     location ~ * \. (jpg | png | gif | jpeg | css | js) $ verfällt 1h; 

Schritt 4 Reduzieren Sie die MySQL-Datenbankgröße

Seit WordPress 2.6 speichert WordPress beim Schreiben automatisch Posts, die auch nach dem Postieren als Revision in der MySQL-Datenbank gespeichert werden. Eine größere Datenbank sendet auch die Ladezeit der Site höher. Ich empfehle das Entfernen der Revisionsfunktion.

Fügen Sie Folgendes in ein wp-config.php Revisionen deaktivieren:

 define ('WP_POST_REVISIONS', false);

Wenn Sie sich dafür entscheiden, die Überarbeitungsfunktion beizubehalten, können Sie auch die Überarbeitungen der Datenbank für eine festgelegte Anzahl von Tagen beibehalten, z. 10 Tage.


Mehr…

  1. Das Hinzufügen des Expires-Headers wirkt sich nicht auf die Ladezeit der Website für einen ersten Besuch aus. Sie werden jedoch überrascht sein, um wie viel die Seitenlast beim nächsten Seitenaufruf / Besuch eines wiederkehrenden Besuchers reduziert wird.
  2. Verfolgen Sie, wie Ihre Website abläuft: Zeigen Sie die Anzahl der Abfragen und die Uhrzeit an, zu der sie geladen werden.

    Fügen Sie einfach den folgenden Code hinter dem Copyright-Text Ihres Themes ein footer.php:

      Anfragen in  Sekunden.

Kennen oder verwenden Sie andere Methoden, um die Ladezeit Ihres Blogs / Ihrer Website zu optimieren? Vergiss nicht, sie per Kommentar zu teilen.