Come raggruppare e minimizzare le risorse in WordPress
Avere le migliori prestazioni possibili è il sogno di tutti coloro che gestiscono un sito Web, un gruppo e minimizzano le risorse su WordPress è una delle cose migliori che possiamo fare per questo, ma potrebbe essere davvero difficile. Raggruppare tutte le tue risorse (principalmente file css e js) può esporre il tuo sito Web se non sei uno sviluppatore perché potrebbe generare conflitti.
WP Speed of Light è la soluzione migliore per eseguire il tuo sito wordpress perché ha molte opzioni per caricare velocemente il tuo sito con una dashboard davvero amichevole e sì, una di queste opzioni è raggruppare e minimizzare le risorse. Il processo di inclusione/esclusione del singolo file dal gruppo e minimizzazione è una chiave per un'ottimizzazione personalizzata senza conflitti.
Utilizzeremo un sito wordpress di esempio per questo post di blog e impareremo come farlo in modo che il processo di configurazione di tutto sia più semplice.
Come eseguire una minificazione di WordPress JS e CSS
Impariamo come eseguire una minificazione js e CSS wordpress ma, prima di tutto, dobbiamo sapere cosa significa la minificazione "La minificazione si riferisce al processo di rimozione di dati superflui o superflui senza influire sul modo in cui la risorsa viene elaborata dal browser, ad esempio commenti di codice e formattazione, rimozione di codice inutilizzato, utilizzo di nomi di funzioni e variabili più brevi e così via ”.
Ora quello che faremo è un test di velocità sulla nostra pagina per vedere i cambiamenti, per questo esempio, stiamo usando un sito con woocommerce e alcuni prodotti, quindi la prima volta si caricherà un po 'lentamente.
Sì, 2,79 secondi per caricare la pagina, non male ma potrebbe essere migliore, riduciamo a icona js e CSS e vediamo la differenza, vai su WP Speed of light > SpeedUp > Group & Minify , sarai in grado per vedere il menu con tutte le opzioni per minimizzare. La versione gratuita del plug-in include l'opzione raggruppa e minimizza, ma l'esclusione del file visivo è disponibile solo nella versione PRO Addon.
Le opzioni del componente aggiuntivo PRO sono: Escludi script in linea (Escludi script in linea dalla minimizzazione), sposta gli script a piè di pagina (ti consente di velocizzare il tuo sito spostando tutti gli script minificati a piè di pagina), carattere di gruppo e caratteri Google (caratteri locali di gruppo e caratteri Google in un unico file per essere servito più velocemente) ed Esclusione file avanzata.
Hai la possibilità di minimizzare, come puoi vedere, JS, CSS e anche l'HTML ora basta attivare queste opzioni, fare clic su salva e tutte le tue risorse verranno minimizzate subito, potrebbe avere problemi in quanto è una configurazione avanzata ma tutto può essere risolto con l'esclusione di alcuni codici e file (con l'addon pro).
Ora tutto il lavoro degli sviluppatori che potrebbe richiedere ore viene svolto in pochi secondi.
Il prossimo passo, WordPress ottimizza CSS e JS
Con questo plugin lasceremo che wordpress ottimizzi CSS e js semplicemente abilitando le opzioni di gruppo sulla dashboard, vai su WP Speed of Light > SpeedUp> Group & Minify , sarai in grado di vedere una dashboard con le opzioni per raggruppare CSS e js.
Queste opzioni ti consentono di:
- Gruppo JS: il raggruppamento di più file Javascript in un singolo file ridurrà al minimo il numero di richieste HTTP
- Raggruppa CSS: il raggruppamento di più file CSS in un singolo file ridurrà al minimo il numero di richieste HTTP.
Richieste HTTP: sono richieste che vengono inviate al server ogni volta che selezioniamo qualcosa o andiamo su un'altra pagina dello stesso sito, quindi se possiamo ridurre queste richieste, il tempo di caricamento si ridurrebbe.
Per verificare quanti file e script puoi raggruppare sul tuo sito web, apri la console del browser (tasto destro > Ispeziona o F12) e apri il pannello di rete .
È quindi possibile elencare tutti i file caricati per tipo, qui in questo esempio ho fatto clic solo sull'elenco dei file JS.
Ora che siamo su queste impostazioni, basta abilitare le opzioni di gruppo (Gruppo CSS e Gruppo JS) e fare clic su Salva, tenere presente che queste opzioni devono essere utilizzate con cautela e dovrai testare la tua pagina perché potrebbe causare conflitti .
Prendiamo sul serio e ottimizziamo il peso del carattere
Che cosa? Altra ottimizzazione? Sì! sarai in grado di ottimizzare il peso del carattere e sarà facile come abilitare l'opzione nelle impostazioni, basta andare su WP Speed of Light > SpeedUp> Group & Minify> Group fonts and Google Fonts option.
I caratteri di gruppo e l'opzione dei caratteri di Google ti permetteranno di raggrupparli in un unico file per essere servito più velocemente, questo è abbastanza utile poiché la maggior parte dei temi e dei layout di WordPress viene fornito con 2 o caratteri per impostazione predefinita con tutte le declinazioni (normale, grassetto, corsivo ...)
Basta abilitare quell'opzione, fare clic su Salva e tutti i caratteri verranno raggruppati.
Ora che abbiamo attivato tutte le opzioni per minimizzare e raggruppare le risorse, dovremmo vedere una differenza nel tempo di caricamento del nostro sito, controlliamo la velocità.
Che differenza, da 2,8 a 0,56 secondi! Come ti abbiamo detto all'inizio di questo post, possiamo migliorare il tempo di caricamento;)
Come utilizzare l'esclusione di minimizzazione dei file
La minimizzazione potrebbe causare problemi nel tuo sito, accade principalmente quando raggruppi determinati file che contengono errori nell'errore di sintassi o variabile simile, nome della classe. Ecco perché con l'opzione "Esclusione di minimizzazione dei file", sarai in grado di escludere i file dal processo di minimizzazione e raggruppamento, vai su WP Speed of Light > SpeedUp> Raggruppa e riduci , sarai in grado di vedere l' opzione di esclusione file avanzata
Per utilizzare l'esclusione file avanzata, è necessario eseguire prima una scansione abilitare l'opzione e fare clic su Esegui scansione.
Per poter elencare lo script caricato sul tuo sito Web, WP Speed of Light deve scansionare la tua cartella per elencarli. Di solito sono tutti contenuti nella tua cartella /wp-content che raggruppa tutti i tuoi plugin e temi. Seleziona quella cartella (almeno) e fai clic su "Scansiona ora"
Verrà eseguita una scansione, infine, fare clic su Visualizza risultati al termine della scansione.
Di seguito dovrebbe essere visualizzato un elenco di file classificati per tipo (Tutti, JS, CSS, Font). Se hai identificato un file che causa problemi, quando attivi il filegroup e la minimizzazione, puoi escluderlo da qui utilizzando un semplice interruttore ON/OFF .
Questo ti aiuterà a escludere file e, in questo modo, a risolvere facilmente qualsiasi problema che potrebbe esistere durante la minimizzazione delle risorse… Il processo di gruppo e minimizzazione richiede ancora un po' di lavoro, soprattutto nei test, ma ne vale sicuramente la pena, e lo farai. potrai sempre testare come funziona eseguendo lo speed test direttamente da WP Speed of Light .
Vai avanti e prova WP Speed of Light : https://www.joomunited.com/wordpress-products/wp-speed-of-light
Quando ti iscrivi al blog, ti invieremo una e-mail quando ci saranno nuovi aggiornamenti sul sito per non perderli.
Commenti