Ottimizzazione della velocità di caricamento di WordPress con header.php e .htaccess

La velocità di caricamento del sito è molto importante per ogni blog / sito Web, soprattutto per le persone con hosting condiviso, che è il servizio di hosting disponibile più economico. Eccone alcuni .htaccess e header.php trucchi per aumentare la velocità di caricamento del tuo sito web del 50-70%


Il rendimento Web sta ottenendo sempre più attenzione dagli sviluppatori web ed è uno degli argomenti più caldi nello sviluppo web. Innanzitutto, la velocità di caricamento è più di una funzionalità. La velocità è la caratteristica più importante. Se il tuo sito web o blog è lento, le persone non lo useranno.

Che velocità significa per giganti di Internet:

  • Per Google - 500 millisecondi di tempo di caricamento extra hanno causato il 20% di ricerche in meno
  • Per Yahoo - 400 millisecondi di tempo di caricamento extra ha causato un aumento del 5-9% del numero di persone che hanno fatto clic su "indietro" prima che la pagina fosse caricata
  • Per Amazon - 100 millisecondi di tempo di caricamento extra hanno causato un calo delle vendite dell'1%

Google, nel suo continuo sforzo per rendere il web più veloce, ha scritto sul blog che "abbiamo deciso di tenere conto della velocità del sito nelle nostre classifiche di ricerca".

Quindi un sito web più lento ridurrà anche il tuo posizionamento nei motori di ricerca.

Quindi la velocità di caricamento conta molto. CDN (Content Delivery System) è abbastanza buono per questo scopo, ma fino a un certo limite, e i buoni fornitori di CDN sono un po 'costosi.

La buona notizia è che alcune delle più importanti ottimizzazioni della velocità possono essere facilmente eseguite con semplicità .htaccess trucchi. Questi possono rendere più veloce il caricamento di qualsiasi sito Web comprimendo il contenuto e abilitando il caching del browser, e seguire le migliori pratiche per accelerare il tuo sito Web dal team di prestazioni eccezionali di Yahoo! e non costa un centesimo.


Passaggio 1 Compressione file Gzip

La compressione riduce i tempi di risposta riducendo la dimensione della risposta HTTP.

Vale la pena gzip di documenti, script e fogli di stile HTML. In effetti, vale la pena di comprimere qualsiasi risposta testuale tra cui XML e JSON.

I file immagine e PDF non devono essere compressi con gzip perché sono già compressi. Cercando di gzip non solo si spreca CPU, ma si può potenzialmente aumentare la dimensione dei file.

La compressione dei file consente inoltre di risparmiare una parte della larghezza di banda.

Con .htaccess

  • Per i server Apache

    mod_pagespeed è un modulo Apache sviluppato da Google e la sua direttiva di comando può essere utilizzata come gli altri moduli.

    Attualmente solo GoDaddy e DreamHost supportano il mod_pagespeed modulo, quindi se si ospita con loro basta copiare e incollare il seguente codice al tuo .htaccess file:

      ModPagespeed su # utilizzando comandi, filtri ecc 

    Molti di voi potrebbero stare con altri provider di hosting che non supportano il mod_pagespeed modulo.

    Puoi usare il mod_deflate modulo (utilizzato Apache 1.3x mod_gzip ma poiché Apache 2x mod_deflate viene usato)

      AddOutputFilterByType DEFLATE testo / testo html / testo semplice / applicazione xml / applicazione xml / xhtml + testo xml / testo css / applicazione javascript / applicazione javascript / x-javascript 
  • Per i server Nginx

    Se si ospita su un server Web Nginx, copiare quanto segue sul proprio .htaccess per abilitare la compressione gzip.

     server gzip on; gzip_types text / html text / css application / x-javascript text / testo normale / immagine xml / x-icon; 

Con header.php

Se il tuo server non supporta mod_deflate o mod_gzip puoi usare questo script PHP per la compressione gzip che funziona sia su Apache che su Nginx

Copia questo nel tuo tema header.php

 

Di seguito è riportato il grafico a barre che illustra la velocità di caricamento del mio sito web senza e con compressione gzip.


Passaggio 2 Disattivare gli ETag

Gli ETag (Tag di entità) sono un meccanismo utilizzato dai server Web e dai browser per determinare se il componente nella cache del browser corrisponde al server originale. Gli Etags vengono aggiunti per fornire un meccanismo per la convalida delle entità più flessibile rispetto alla data dell'ultima modifica. Un ETag è una stringa che identifica in modo univoco una versione specifica di un componente. Le limitazioni di questo formato sono che la stringa è quotata. Il server di origine specifica l'ETag del componente utilizzando l'intestazione di risposta ETag.

Per disabilitare ETags, incolla questo nel tuo .htaccess file

 Intestazione non impostata ETag FileETag Nessuna

Passaggio 3 Utilizzare la memorizzazione nella cache del browser

Con la memorizzazione nella cache del browser, stiamo esplicitamente istruendo i browser a rimanere bloccati su determinati file per un determinato periodo di tempo. Quando il file è nuovamente necessario, il browser deve prelevare dalla propria cache locale invece di richiederlo nuovamente dal server.

L'esecuzione di un sito Web senza la memorizzazione nella cache ha lo stesso senso di guidare al negozio per un bicchiere d'acqua ogni volta che si ha sete. Non solo è poco pratico e miope, ci vuole più lavoro!

Il caching del browser è davvero utile per ottenere utenti di ritorno; Ad esempio, può costruirti visitatori permanenti fedeli e risparmiare molta della tua larghezza di banda.

Un visitatore che visita per la prima volta effettuerà diverse richieste HTTP per scaricare tutti i file del tuo sito, ma utilizzando le intestazioni Expires e Cache-Control rendi questi file memorizzabili nella cache. Ciò evita richieste HTTP non necessarie nelle successive visualizzazioni di pagina.

  • Per i server Apache

    Apache abilita attraverso il mod_expires e mod_headers moduli.

    Il mod_expires modulo controlla l'impostazione dell'intestazione HTTP Expires e la direttiva max-age dell'intestazione HTTP Cache-Control nelle risposte del server. Per modificare le direttive di Cache-Control diverse da max-age, è possibile utilizzare mod_headers modulo.

    Il mod_headers modulo fornisce direttive per controllare e modificare le intestazioni di richieste e risposte HTTP. Le intestazioni possono essere unite, sostituite o rimosse.

    Aggiungi queste regole a .htaccess per impostare le intestazioni di Expires:

     # INIZIO Scade le intestazioni  ExpiresActive On ExpiresDefault "accesso più 5 secondi" ExpiresByType immagine / x-icona "accesso più 2592000 secondi" ExpiresByType image / jpeg "accesso più 2592000 secondi" ExpiresByType image / png "accesso più 2592000 secondi" ExpiresByType image / gif "accesso più 2592000 secondi Accesso "ExpiresByType application / x-shockwave-flash" più 2592000 secondi "ExpiresByType text / css" accesso più 604800 secondi "ExpiresByType text / javascript" accesso più 216000 secondi "ExpiresByType application / javascript" accesso più 216000 secondi "ExpiresByType application / x- javascript "access plus 216000 seconds" ExpiresByType text / html "access plus 600 secondi" ExpiresByType application / xhtml + xml "access plus 600 secondi"  # END Scadono le intestazioni

    .htaccess regole per l'impostazione dell'intestazione del controllo della cache:

     # INIZIO Intestazioni di controllo della cache   Intestazione set Cache-Control "public"   Intestazione set Cache-Control "public"   Intestazione set Cache-Control "privato"   Header set Cache-Control "private, must-revalidate"   # END Intestazioni di controllo della cache

    Nota:

    1. Non è necessario impostare il max-age direttiva con l'intestazione Cache-Control poiché è già impostata da mod_expires modulo.
    2. must-revalidate significa che una volta che una risposta diventa obsoleta deve essere riconvalidata; non significa che deve essere controllato ogni volta.
  • Per i server NGINX

    Il corrispondente .htaccess le impostazioni in Nginx assomigliano a questo:

    (L'esempio qui sotto direbbe ai browser dei visitatori di aggrapparsi a HTML, CSS, Javascript, immagini e favicon per un'ora)

     posizione ~ * \. (jpg | png | gif | jpeg | css | js) $ scade 1h; 

Passaggio 4 Ridurre le dimensioni del database MySQL

Dal momento che WordPress 2.6, WordPress salva automaticamente i post mentre scrive che rimangono anche dopo che il post è stato salvato come revisione nel database MySQL. Il database più grande invia anche il tempo di caricamento del sito più alto. Suggerisco di rimuovere la funzionalità di revisione.

Incolla quanto segue a wp-config.php per disabilitare le revisioni:

 define ('WP_POST_REVISIONS', false);

Se decidi di mantenere attiva la funzione di revisione, puoi anche decidere di mantenere le revisioni sul database per un numero fisso di giorni, ad es. 10 giorni.


Di Più…

  1. L'aggiunta dell'intestazione di scadenza non influisce sul tempo di caricamento del sito Web per una prima visita, ma rimarrai sorpreso di quanto il carico della pagina venga ridotto per la successiva visualizzazione di pagina / visita di un visitatore di ritorno.
  2. Tieni traccia dell'andamento del tuo sito: visualizza il numero di query e il tempo di caricamento.

    Basta incollare il seguente codice dopo il testo del copyright nel tema footer.php:

      domande in  secondi.

Conosci o usi qualche altro metodo per ottimizzare i tempi di caricamento del tuo blog / sito web? Non dimenticare di condividerli commentando.