Unlimited WordPress themes, graphics, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. WordPress
Code

Installazione del modulo Google PageSpeed

by
Difficulty:IntermediateLength:MediumLanguages:
This post is part of a series called Improving Google PageSpeed.
Optimizing Google PageSpeed to 100 in WordPress

Italian (Italiano) translation by Marco Calcanti (you can also view the original English article)

Final product image
What You'll Be Creating

Benvenuti al mio terzo tutorial su come ottimizzare il tuo Google Page Speed. Per coloro che non sono a conoscenza, Google PageSpeed è uno strumento gratuito che valuta le prestazioni e l'usabilità del tuo sito Web per piattaforme desktop e mobile. È molto importante perché Google lo utilizza per determinare gli elementi chiave del nostro SEO ranking, cioè quanto in alto siamo visualizzati nei risultati delle ricerche.

Così i webmaster sanno che è importante avere una buona PageSpeed, anche se c'è dibattito su questo. Ad esempio, la velocità della pagina del New York Times è attualmente tra 60 e 68 su 100.

Nel primo episodio, mi sono addentrato cercando di migliorare la mia PageSpeed con un tema fatto da un provider ormai defunto, Hands On Improving Google PageSpeed (Envato Tuts+). In definitiva, è uscita una PageSpeed per mobile di 70 e desktop 86.

Nel secondo episodio, ho fatto il mio blog un sito di sviluppo mirato ed ho personalizzato il mio codice di WordPress in modo da raggiungere PageSpeed 100 su entrambi mobile e desktop. Vedi Optimizing Google PageSpeed to 100 in WordPress (Envato Tuts+).

E ho avuto successo per un periodo di tempo:

Google PageSpeed Module - Page Insights at 100 for Mobile and Desktop

Oggi, intenzione di dirvi di più circa la mia esperienza con l'ottimizzazione PageSpeed e un'alternativa meno nota da fare da soli, Google's own PageSpeed module. È possibile installarlo per Apache e nginx.

PageSpeed può integrare con il tuo server web Apache o Nginx per ottimizzare automaticamente il tuo sito. — Google

Prima di iniziare, ricordati che tenterò di partecipare alle discussioni qui sotto. Se avete una domanda o un suggerimento sull'argomento, postate un commento qui sotto o contattatemi su Twitter @reifman. Mi interessa la vostra esperienza con WordPress e PageSpeed.

Mantenere un ottimale PageSpeed

Se il mio blog era il mio obiettivo a tempo pieno, allora forse non sarebbe stato troppo difficile mantenere il codice ottimizzato per PageSpeed con i WordPress plugin aggiornamenti e aggiornamenti di tema che arrivano. Ma così non è. E, francamente, mantenere questo lavoro ha dimostrato che richiede tempo.

Desideravo di tornare ai vecchi tempi di aggiornamenti clic del mouse.

Google non premia per un'alta PageSpeed

Ho anche notato che dopo essere passato a un nuovo tema e ottimizzato mio PageSpeed a 100, il traffico in realtà è diminuito e rimasto giù. Certamente, il layout del tema responsive aveva qualcosa a che fare con esso, ma Google non mi ha mai ricompensato per raggiungere un PageSpeed 100.

Similarmente, dalla discussione su Installing AMP in WordPress (Envato Tuts+), AMP è stato creato per catturare l'attenzione degli editori di notizie, ma non da molto per i piccoli editori. Google non ha mai fornito traffico aggiuntivo al mio blog dopo aver provveduto al supporto AMP.

Così ho deciso di spostare la mia attenzione su PageSpeed e passare a un nuovo tema che dovrebbe aiutare gli utenti a navigare il mio sito più facilmente. Ho anche disinstallato AMP per il momento.

Provando il modulo Google PageSpeed

Sembrava l'occasione perfetta per disattivare tutti i miei JavaScript e CSS personalizzati raggruppandoli e sperimentarli con il modulo PageSpeed di Google, che funziona a livello di server che fa per voi.

Sul modulo Google PageSpeed

Fondamentalmente, il modulo di Google PageSpeed automatizza un sacco delle ottimizzazioni delle prestazioni che sue classifiche PageSpeed richiedono. Ed è disponibile sui popolari server open source Apache e nginx.

Il modulo PageSpeed comprime e combina file come JavaScript e CSS fogli di stile inclusi ma sostituisce anche immagini con formati di file compressi, progressivo (. webp).

Istantanee del mio PageSpeed prima dell'installazione

Dopo aver installato il mio nuovo tema, ho fatto "prima" istantanee del mio punteggio PageSpeed. Ho ricevuto un 83 per desktop:

Google PageSpeed Module - Before Test 83 for Desktop PageSpeed

E un 64 inferiore per mobile:

Google PageSpeed Module - Before Test 64 for Mobile PageSpeed

Installazione del modulo PageSpeed

Per questo tutorial, ti guiderò attraverso l'installazione di Apache. Google offre anche nginx istruzioni di installazione.

Il modulo PageSpeed non è incluso nelle directory dei pacchetti di Ubuntu, ma è necessario scaricarlo manualmente tramite wget:

Quindi, usare dpkg per installare il modulo:

E infine, apt-get - f install per correggere eventuali dipendenze:

Quindi, riavviare il server Apache:

I file dal vostro CDN di supporto

All'inizio, ho scritto un articolo sponsorizzato accelera il tuo Content Delivery con KeyCDN e tuttora lo uso. Se si utilizza un CDN per il tuo sito, è necessario indicare il modulo PageSpeed su di esso.

Ecco come visualizzare e modificare file di configurazione del modulo:

E qui è la configurazione di base:

Tutti i siti funzioneranno di default con esso. Ma è necessario aggiungere manualmente i domini secondari di CDN:

I miei CDN sono al c1-, c2-, c3- e c4- .jeffreifman.com, così ho usato un ? carattere jolly per fare riferimento a tutti e quattro di sopra.

Poi, naturalmente, è necessario riavviare Apache ancora una volta, come abbiamo fatto in precedenza.

L'analisi dei risultati del modulo PageSpeed

È possibile controllare il codice sorgente sul tuo sito per vedere se il modulo PageSpeed sta funzionando. Ecco un esempio dalla parte superiore della pagina a JeffReifman.com:

Si noti quale l'URL src c'è ora:

568f4.js.PageSpeed.JM.7B4hJGmADB.js

Ecco un'immagine più grande, posizionata manualmente (tra l'altro uno dei miei annunci di casa) convertibile in PageSpeed .webp:

Tutto questo avviene automaticamente.

Modifiche deludenti PageSpeed

Nel complesso, i risultati utilizzando il modulo PageSpeed erano deludenti per conto proprio. Ho guadagnato 4 punti sul desktop e (meglio) 8 punti sul telefonino.

Ecco il punteggio dopo per desktop:

Google PageSpeed Module - After Test 87 for Desktop PageSpeed

Ecco il punteggio dopo per mobile:

Google PageSpeed Module - After Test 72 for Mobile PageSpeed

In chiusura

Se sei un amministratore di sistema, è possibile che il modulo di Google PageSpeed sarà molto utile. È completamente configurabile, ed è possibile personalizzarlo in una varietà di modi per un impatto migliore. Tuttavia, per lo sviluppatore medio, ho dubbi sulla sua efficacia:

  • I guadagni di prestazioni di base sono stati limitati.
  • Ulteriore personalizzazione è molto complessa.
  • PageSpeed non chiarisce l'incremento (all'occorrenza) mappa per aumentare il traffico di ricerca.

Sono felice che Google offre questo modulo ed è progettato per funzionare all'interno di sistemi complessi, ma il suo impatto per gli amministratori di sistema fai da te ogni giorno è limitato.

Se avete domande, lascia un commento qui sotto. O potete contattarmi su Twitter @reifman. Si prega di consultare la mia pagina di istruttore Envato Tuts+ per vedere altri tutorial che ho scritto, come clonazione WordPress in Linux (in 90 secondi.) E vi invito a un check out mie due serie di programmazione qui: come si programma con Yii2 e Costruire una Startup con PHP.

Link correlati

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.