Notizie Blog: WordPress e Joomla Extensions

Come raggruppare e minimizzare le risorse in WordPress

File-gruppo-e-minify

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 velocizzare il caricamento del tuo sito con una dashboard davvero amichevole e sì, una di queste opzioni è raggruppare e minimizzare le risorse. L'inclusione / esclusione di un singolo file dal gruppo e il processo di minimizzazione è la 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 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.

 

prima del test

 

Sì, 2,79 secondi per caricare la pagina, non male ma potrebbe essere meglio, minimizziamo js e CSS e vediamo la differenza, vai a WP Speed of light> SpeedUp> Raggruppa e minimizza, sarai in grado di vedere il menu con tutte le opzioni per minimizzare. La versione gratuita del plug-in include l'opzione group e minify ma l'esclusione dei file visivi è disponibile solo nella versione del componente aggiuntivo PRO.

 

gruppo-e-minify-cruscotto

 

Le opzioni del componente aggiuntivo PRO sono: Escludi script inline (Escludi script inline dalla minificazione), sposta gli script in piè di pagina (consente di velocizzare il tuo sito spostando tutti gli script minimizzati in piè di pagina), Font di gruppo e Google Fonts (Raggruppa i font locali e i font di Google in un singolo file in essere servito più velocemente) ed esclusione di file avanzata.
 
Hai la possibilità di minimizzare, come puoi vedere, JS, CSS e anche l'HTML ora attivano solo queste opzioni, fai clic su Salva e tutte le tue risorse verranno minimizzate immediatamente, potrebbe avere problemi in quanto si tratta di una configurazione avanzata ma tutto può essere corretto con l'esclusione di alcuni codici e file (con l'addon pro).

 

minify-risorse

 

 

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 permetteremo a wordpress di ottimizzare CSS e js semplicemente abilitando le opzioni di gruppo sulla dashboard, andare a WP Speed of Light> SpeedUp> Raggruppa e minimizza, potrai 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: si tratta di richieste che vengono inviate al server ogni volta che selezioniamo qualcosa o andiamo in un'altra pagina dello stesso sito, quindi se possiamo ridurre queste richieste, il tempo di caricamento si ridurrebbe.

Per verificare quanti file, script è possibile raggruppare sul sito Web, basta aprire la console del browser (fare clic con il pulsante destro del mouse> Ispeziona o F12) e aprire il pannello di rete.

 

list-script-cromo

È 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 sulle impostazioni, basta andare su WP Speed of Light> SpeedUp> Raggruppa e minimizza> Raggruppa caratteri e Google Fonts opzione.
Raggruppa caratteri e l'opzione Caratteri Google ti permetterà di raggrupparli in un singolo file per essere serviti più velocemente, questo è abbastanza utile poiché la maggior parte dei temi e layout di WordPress arrivano con 2 o caratteri di default con tutte le declinazioni (normale, grassetto, corsivo ...)

Basta abilitare quell'opzione, fare clic su Salva e tutti i caratteri verranno raggruppati.

 

gruppo-font

 


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à.

 

test-dopo

 

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, si verifica principalmente quando si raggruppano determinati file che contengono errori nell'errore di sintassi o variabili simili, nome della classe. Ecco perché con l'opzione "Esclusione della minimizzazione dei file", sarai in grado di escludere i file dal processo di minificazione e gruppo, vai a WP Speed of Light> SpeedUp> Raggruppa e minimizza, sarai in grado di vedere il Esclusione di file avanzata opzione.

Per utilizzare l'esclusione file avanzata, è necessario eseguire prima una scansione abilitare l'opzione e fare clic su Esegui scansione.

 

gruppo-risorse-conflitti-alert

 
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 cartella / wp-content che raggruppa tutti i plugin e il tema. Seleziona quella cartella (almeno) e fai clic su "Scannerizza ora"

 

selezionare-cartelle-to-scan

 

Verrà eseguita una scansione, infine, fare clic su Visualizza risultati al termine della scansione.

 

digitalizzata

 

Un elenco di file classificati per tipo (Tutti, JS, CSS, Font) dovrebbe essere visualizzato sotto. Se hai identificato un file che causa problemi, quando attivi il gruppo di file e la minificazione, puoi escluderlo da qui usando un semplice Commutatore ON / OFF.

 

escludere-files

 

Questo ti aiuterà ad escludere i file e, in questo modo, a risolvere facilmente qualsiasi problema che potrebbe verificarsi durante la minimizzazione delle risorse ... Raggruppare e minimizzare i processi richiedono ancora un po 'di lavoro, specialmente nei test, ma ne vale sicuramente la pena.
 
Vai avanti e prova WP Speed of Light: https://www.joomunited.com/wordpress-products/wp-speed-of-light

3
Sincronizzazione istantanea dei file di Google Drive con Dro ...
Collegamento di WordPress al cloud tramite WP Media Fo ...
 

Commenti

Non ci sono ancora commenti. Puoi essere il primo a inviare un commento
Già registrato? Accedi qui
ospite
Lunedì 16 settembre 2019
Se desideri registrarti, inserisci i campi nome utente, password e nome.

Immagine Captcha