Per quanto riguarda le prestazioni di WordPress, abbiamo molto da dire sui plugin. Ogni plugin aggiunge codice PHP che deve essere eseguito, in genere include script e stili e può anche eseguire query aggiuntive sul database. Ciò significa che i plugin non necessari possono influire sulla velocità della pagina e possono avere un impatto negativo sull’esperienza dell’utente e sul posizionamento nei motori di ricerca.

Ad esempio, prendiamo in considerazione un plugin che crea e visualizza moduli personalizzati nelle pagine del sito, come Contact Form 7. In genere, è necessario un solo modulo su una singola pagina, ma in teoria potreste voler incorporare un modulo in qualsiasi pagina utilizzando lo shortcode del plugin. Per questa ragione, Contact Form 7 carica script e stili su ogni pagina del vostro sito web.

Ma volete davvero eseguire il codice del plugin e includere script e stili su ogni pagina del vostro sito WordPress?

In questo post mostrerò come impedire il caricamento di plugin non necessari su specifici post/pagine, in modo da poter installare plugin aggiuntivi (non esagerate, ovviamente) e fare comunque in modo che il vostro sito carichi velocemente. Per raggiungere questo obiettivo, disabiliteremo i plugin di WordPress programmaticamente su specifici post e pagine. È una procedura in quattro passaggi:

Cominciamo.

Disattivare selettivamente i plugin di WordPress dal caricamento su pagine/post/intero sito può velocizzare il tuo sito web! 🚀 Click to Tweet

Tre Regole Generali da Seguire Quando si Sceglie un Plugin

Le seguenti regole generali possono essere utili quando si sceglie un plugin:

      • Installate solo plugin ben codificati da sviluppatori affidabili: tenete in considerazione il numero di installazioni attive, la valutazione utenti, il supporto ai clienti, la frequenza di aggiornamento e qualsiasi informazione utile proveniente dalla comunità di WordPress.
      • Preferite plugin scalabili: confrontate plugin simili in termini di prestazioni, avvalendovi di strumenti di sviluppo dei browser e/o di servizi online come Google Pagespeed InsightsPingdom, e GTmetrix per valutare l’impatto di ciascun plugin sul tempo di caricamento della pagina.
      • Non installate plugin non necessari: dovrebbe essere ovvio, ma vale la pena ricordare che non si dovrebbe mai installare un plugin di cui non si ha realmente bisogno, per motivi di sicurezza e prestazioni. Inoltre, assicuratevi di rivedere i plugin di tanto in tanto e disinstallate quelli che non vi servono e non usate più.
reputazione repository wordpress

La Directory dei Plugin di WordPress fornisce informazioni importanti da considerare sempre quando si sceglie un plugin

Un Esempio Concreto

Contact Form 7 è un ottimo plugin che crea e visualizza moduli in WordPress. Fornisce un esempio perfetto per i nostri scopi, perché include i seguenti file su ogni pagina, anche se la pagina non contiene un modulo:

      • style.css
      • scripts.js
La scheda Network di Chrome Dev Tools fornisce informazioni dettagliate sulle richieste di rete effettuate al caricamento della pagina

La scheda Network di Chrome Dev Tools fornisce informazioni dettagliate sulle richieste di rete effettuate al caricamento della pagina

Un plugin può rallentare il vostro sito Web, ma possiamo forzare WordPress a disattivare selettivamente i plugin a seconda dell’URL della richiesta. Se siete sviluppatori, leggete la prossima sezione dove vedremo come gestire i plugin in modo programmatico e creare un plug-in Mu che filtri i plug-in non necessari. Se non sei uno sviluppatore, non esitare a visitare la sezione dedicata ai plugin che consentono di filtrare e organizzare i plugin .

Come Ottenere un Elenco di Tutti i Plugin Attivi Programmaticamente

Innanzitutto, potete ottenere un elenco di tutti i plugin attivi sul vostro sito WordPress con un semplice blocco di codice PHP. Potete aggiungere il seguente codice in un plugin personale o nell’editor di un plugin gratuito per WordPress come Code Snippets. Se decidete di utilizzare il vostro plugin personale, non dimenticare di aggiungere l’intestazione del plugin come mostrato più avanti.

I plugin attivi nella tabella wp_options

I plugin attivi nella tabella wp_options

Ogni plugin attivo è memorizzato nella tabella wp_options dove options_name è active_plugins. Quindi possiamo estrarre la lista di questi plugin con una semplice chiamata get_option. Ecco il codice:

<?php
/**
 * @package active-plugins
 * @version 1.0
 *
 * Plugin Name: Active Plugins
 * Plugin URI: http://wordpress.org/extend/plugins/#
 * Description: This is a development plugin 
 * Author: Your Name
 * Version: 1.0
 * Author URI: https://example.com/
 */

add_shortcode( 'activeplugins', function(){
	
	$active_plugins = get_option( 'active_plugins' );
	$plugins = "";
	if( count( $active_plugins ) > 0 ){
		$plugins = "<ul>";
		foreach ( $active_plugins as $plugin ) {
			$plugins .= "<li>" . $plugin . "</li>";
		}
		$plugins .= "</ul>";
	}
	return $plugins;
});

Modificate i dettagli del plugin, quindi salvate il file active-plugins.php e caricatelo nella cartella /wp-content/plugins/. Create un nuovo post e inserite lo shortcode [activeplugins]. Dovrebbe ora essere visualizzato un elenco di tutti i plugin attivi.

L'elenco di plugin attivi mostra il folder e il nome di ogni plugin

L’elenco di plugin attivi mostra il folder e il nome di ogni plugin

Fatto questo, possiamo fare un passo avanti e aggiungere o rimuovere plugin da codice sfruttando il filtro option_active_plugins. Questo filtro appartiene al gruppo di filtri option_$option_name. Questi consentono di filtrare qualsiasi opzione dopo che è stata recuperata dal database. Dato che tutti i plugin attivi sono memorizzati nella tabella wp_options dove option_value è active_plugins, il filtro option_active_plugins fornisce un modo per attivare o disattivare i plugin programmaticamente.

Così possiamo attivare un plugin a livello di programmazione. Supponiamo, ad esempio, di voler attivare il plugin ACF. Ecco il codice:

add_filter( 'option_active_plugins', function( $plugins ){

	$myplugin = "advanced-custom-fields/acf.php";

	if( !in_array( $myplugin, $plugins ) ){
		$plugins[] = $myplugin;
	}

	return $plugins;

} );

In questo esempio, supponiamo che il plugin sia stato installato e non sia stato ancora attivato.

Il codice sopra aggiunge semplicemente il plugin alla lista dei plugin attivi su ogni pagina del nostro sito. Non è molto utile, ma il senso è chiaro.

Inoltre, il plugin dovrebbe caricare prima di qualsiasi altro plugin, altrimenti il ​​nostro codice non potrebbe funzionare come previsto. Per dare la priorità al caricamento del nostro plugin, dobbiamo aggiungere il nostro script in un plugin Must-use.

Come Creare un Must-use Plugin per Disattivare i Plugin Programmaticamente

Creeremo un Must use plugin, che è un plugin che risiede in una sottocartella specifica di /wp-content e viene eseguito prima di qualsiasi normale plugin.

Sfortunatamente, in questa situazione, non è consentito utilizzare tag condizionali, perché i query tag condizionali non funzionano prima dell’esecuzione della query. Prima di questa, restituiscono sempre false. Quindi dobbiamo verificare le nostre condizioni in altro modo, ad esempio analizzando l’URI della richiesta e controllando il percorso dell’URL corrispondente.

Aggiungete il seguente codice al file active-plugins.php, quindi spostatelo in /wp-content/mu-plugins:

$request_uri = parse_url( $_SERVER['REQUEST_URI'], PHP_URL_PATH );

$is_admin = strpos( $request_uri, '/wp-admin/' );

if( false === $is_admin ){
	add_filter( 'option_active_plugins', function( $plugins ){

		global $request_uri;

		$is_contact_page = strpos( $request_uri, '/contact/' );

		$myplugin = "contact-form-7/wp-contact-form-7.php";

		$k = array_search( $myplugin, $plugins );

		if( false !== $k && false === $is_contact_page ){
			unset( $plugins[$k] );
		}

		return $plugins;

	} );
}

Analizziamo questo codice:

      • parse_url restituisce il percorso dell’URL richiesto.
      • strpos trova la posizione della prima occorrenza di '/wp-admin/' e restituisce false se la stringa non viene trovata. La variabile $is_admin memorizza il valore restituito.
      • La condizione evita che il filtro venga eseguito nel pannello di amministrazione, in modo da poter accedere in modo sicuro alle pagine delle impostazioni del plugin. Se l’URI della richiesta non contiene '/wp-admin/', allora invochiamo il filtro option_active_plugins.
      • Infine, se il plugin corrente non si trova nell’array di plugin attivi, e l’URI della pagina corrente non contiene /contact/, rimuoviamo il plugin da $plugins.

Ora salvate il vostro plugin e caricatelo nella cartella /wp-content/mu-plugins/. Svuotate la cache e aggiungete lo shortcode [activeplugins] a più pagine. Dovrebbe essere mostrato nell’elenco solo sulla pagina /contact/.

Il file script.js scompare dalla lista delle risorse della pagina

Il file script.js scompare dalla lista delle risorse della pagina

Possiamo quindi rimuovere un intero array di plugin contemporaneamente con un po’ di PHP aggiuntivo.

$request_uri = parse_url( $_SERVER['REQUEST_URI'], PHP_URL_PATH );

$is_admin = strpos( $request_uri, '/wp-admin/' );

if( false === $is_admin ){
	add_filter( 'option_active_plugins', function( $plugins ){

		global $request_uri;

		$is_contact_page = strpos( $request_uri, '/contact/' );

		$myplugins = array( 
			"contact-form-7/wp-contact-form-7.php", 
			"code-snippets/code-snippets.php",
			"query-monitor/query-monitor.php",
			"autoptimize/autoptimize.php" 
		);

		if( false === $is_contact_page ){
			$plugins = array_diff( $plugins, $myplugins );
		}

		return $plugins;

	} );
}

In questo esempio, abbiamo prima definito una serie di plugin da rimuovere, quindi li rimuoviamo con array_diff. Questa funzione “confronta array1 con uno o più array e restituisce i valori presenti in array1 che non sono presenti in nessuno degli altri array”.

Potete scaricare il codice completo di questo plugin da Gist.

Ora potete caricare il plugin nella cartella mu-plugins e ispezionare qualsiasi pagina del vostro sito web. Il plugin Mu può essere personalizzato in modo più avanzato aggiungendo più condizioni e controllando più URI, ma ogni condizione deve essere aggiunta manualmente al codice e, a lungo termine, questo semplice mu-plugin potrebbe essere difficile da mantenere.

Per questo motivo, potresti dare un’occhiata ai seguenti plugin.

Plugin che Filtrano Plugin

In alternativa, possiamo dare un’occhiata ad una serie di buoni plugin che ci consentono di aggiungere filtri che possono essere gestiti dal pannello di amministrazione di WordPress.

Plugin Load Filter

Plugin Load Filter è una soluzione gratuita per gli utenti di WordPress che hanno bisogno di filtrare i plugin con diverse condizioni.

Plugin Load Filter permette di filtrare i plugin sia nel pannello di amministrazione che nelle pagine del sito

Plugin Load Filter permette di filtrare i plugin sia nel pannello di amministrazione che nelle pagine del sito

Attualmente supporta le seguenti funzionalità:

      • Formati dei Post
      • Custom Post Type
      • Moduli Jetpack
      • WP Embed Content card
      • Filtro degli URL Filter per utenti esperti (REST API / Heartbeat / Ajax / AMP / ecc.)

Una volta attivato un filtro, l’utente amministratore può specificare dove deve essere applicato nel sito, come mostrato nell’immagine qui sotto.

Una volta che il filtro è stato attivato, gli amministratori del sito possono impostare le eccezioni nella scheda Page Type Filter Activation

Una volta che il filtro è stato attivato, gli amministratori del sito possono impostare le eccezioni nella scheda Page Type Filter Activation

Plugin Organizer

Plugin Organizer è un plugin popolare con oltre 10.000 installazioni attive e un impressionante 5 su 5 stelle. È un plugin più completo che consente agli amministratori del sito di:

      • Disattivare selettivamente i plugin per tipo di post e URL di richiesta
      • Disattivare selettivamente i plugin per ruolo utente
      • Creare gruppi di plugin
      • Cambiare l’ordine di caricamento dei plugin
      • Caratteristiche aggiuntive
Pagina delle impostazioni di Plugin Organizer

Pagina delle impostazioni di Plugin Organizer

La pagina delle opzioni Global Plugins offre una funzionalità drag&drop che consente all’utente amministratore di disattivare globalmente i plugin, impedendo a WordPress di eseguire uno o più plugin ovunque nel sito, a meno che non sia specificato diversamente per singoli post o pagine. La stessa funzione è disponibile per i tipi di pagina e post di ricerca.

CF7 è stato disattivato a livello globale

CF7 è stato disattivato a livello globale

Il plugin aggiunge un metabox nella schermata di editing dei singoli post in modo che l’amministratore possa ignorare le impostazioni globali e del tipo di post in generale. Questa funzione può essere attivata anche per i tipi di post, controllando la voce corrispondente nella schermata General Settings. Un’ottima funzionalità è il Plugin Organizer Debug Message, che fornisce all’amministratore del sito informazioni utili sui plugin che hanno effetti su ogni pagina del sito.

Altre informazioni possono essere trovate nella online dello sviluppatore.

Il custom metabox di Plugin Organizer nella pagina dei contatti

Il custom metabox di Plugin Organizer nella pagina dei contatti

Il Plugin Perfmatters

Un approccio parzialmente diverso viene dal plugin perfmatters. È un’alternativa premium che consente all’amministratore del sito di caricare selettivamente le risorse dei temi e dei plugin in base all’URL o al custom post type. È un ottimo strumento sia per l’ottimizzazione dei plugin che dei temi. Ed è sviluppato da un membro del team di Kinsta!

Lo script manager di Perfmatters

Lo script manager di Perfmatters

Il plugin ha una funzionalità chiamata Script Manager, in cui è tutto raggruppato in base al nome del plugin o del tema. Ciò rende super semplice disabilitare un intero plugin o singoli file CSS e JavaScript al suo interno.

È anche possibile disabilitare gli script con espressioni regolari. Questo è particolarmente utile per i siti che hanno una struttura di URL più complessa o pagine generate dinamicamente.

È uno strumento molto potente e può aumentare drasticamente la velocità dei vostri siti WordPress (specialmente la vostra homepage). Alcuni esempi di cosa si può fare con perfmatters:

      • I plugin di condivisione dei social media dovrebbero essere caricati solo nei vostri post. Potete facilmente disattivarlo ovunque e caricare solo nei post, o anche nei custom post type.
      • Il popolare plugin Contact Form 7 si carica su ogni pagina e post. Potete facilmente disattivarlo ovunque con un clic e abilitarlo solo nella vostra pagina di contatto.
      • Se avete aggiornato a WordPress 5.0 ma non utilizzate l’editor a blocchi Gutenberg, ma state ancora utilizzando l’editor classico, ci sono due script del front-end che vengono aggiunti in tutto il sito che potete disabilitare: /wp-includes/css/dist/block-library/style.min.css e /wp-includes/css/dist/block-library/theme.min.css

Come potete leggere in questa recensione di perfmatters, ha ridotto i tempi di caricamento complessivi del 20,2%. Solo sulla loro homepage hanno ridotto il numero di richieste HTTP da 46 a 30! Le dimensioni della pagina si scese da 506,3 KB a 451,6 KB.

Speed test con il plugin perfmatters

Speed test con il plugin perfmatters

Come Tracciare le Prestazioni: gli Strumenti di Sviluppo dei Browser

Un passo fondamentale sulla strada verso l’ottimizzazione delle prestazioni è la misurazione del tempo di caricamento. Abbiamo a disposizione un certo numero di plugin e strumenti online che possiamo utilizzare per monitorare le prestazioni del sito, come Google Pagespeed Insights e Pingdom. Ma prima di tutto, possiamo utilizzare gli strumenti di sviluppo dei browser, che forniscono molte informazioni importanti.

Tutti gli strumenti di analisi dei browser hanno un pannello Network che visualizza un elenco delle richieste di rete con informazioni correlate. Segui questi link per la documentazione dettagliata su ognuno:

In un’installazione di WordPress con diciotto plugin attivi, abbiamo ispezionato ripetutamente la pagina di un post con Firefox Dev Tools. Abbiamo misurato la velocità della pagina ed elencato le risorse richieste prima di installare qualsiasi plugin di filtro. L’immagine che segue mostra l’output del the performance analysis tool disponibile nel Network monitor di Firefox.

Il tool di analisi delle performance di Firefox

Il tool di analisi delle performance di Firefox

Il Network monitor fornisce i seguenti risultati (cache vuota):

      • dimensioni: 255.19 Kb
      • tempo di caricamento: 1.24 secondi
      • richieste: 12

Successivamente, abbiamo installato il Plugin Organizer per non consentire a WordPress di eseguire il plugin CF7. Il grafico a torta cambia un po’.

Il tool di analisi delle performance di Firefox

Il tool di analisi delle performance di Firefox

Ora la pagina carica più velocemente (cache vuota):

      • dimensioni: 104.21 Kb
      • tempo di caricamento: 0.80 secondi
      • richieste: 8

Successivamente, abbiamo disattivato diversi plug-in non necessari e l’immagine successiva mostra quanto abbiamo migliorato il rendimento della pagina.

Il tool di analisi delle performance di Firefox

Il tool di analisi delle performance di Firefox

Dopo aver disabilitato tutti i plugin non necessari, la scheda Empty cache del Network monitor del browser restituisce i seguenti dati:

      • dimensioni: 101.98 Kb
      • tempo di caricamento: 0.46 seconds
      • richieste: 8

Possiamo confrontare i risultati dei nostri test. Le dimensioni della risorsa sono diminuite del 60,04%, il tempo di caricamento è stato ridotto da 1,24 secondi a 0,46 secondi, il numero delle richieste HTTP è passato da 12 a 8. Questo conferma che i plugin influenzano le prestazioni delle pagine e che possiamo aumentare la page speed sfruttando un filtro di plugin.

Riepilogo

Sia nel caso in cui siate voi stessi a programmare i vostri script o che installiate strumenti di terze parti, l’organizzazione e il filtraggio dei plugin è qualcosa da tenere sempre in considerazione quando si tratta di ottimizzare le prestazioni. Ricordate, non tutti i plugin sono sviluppati tenendo in debito conto le prestazioni. Pertanto, può essere opportuno prendersi un po’ di tempo e determinare quali risorse dei plugin (CSS e JS) stiamo caricando e dove.

Ma imparare a disabilitare i plugin di WordPress è solo una delle tante tecniche volte ad aumentare la velocità del sito. Ecco un elenco di altre utili guide e tutorial relativi alle prestazioni del sito:

57
Condivisioni