Una delle cose migliori che abbiamo imparato durante la ricerca per il nostro articolo su come far caricare velocemente il sito web di Joomla (1.29 secondi per l'esattezza), abbiamo scoperto una grande gemma di uno strumento.
Come molte persone fanno quando si sforzano di velocizzare il caricamento di un sito Web, fanno riferimento al file Sito di consigli di Google Page Speed, ed è giusto che sia così, perché se Google fa una dichiarazione, di solito vale la pena ascoltarla. Tuttavia, a volte è piuttosto complicato eseguire tutte le ottimizzazioni e potresti non avere le capacità per eseguire queste modifiche.
Come forse saprai, quando rendi il tuo sito WordPress più veloce, ci sono un sacco di ottimizzazioni che devi fare. Uno di questi è sapere come sfruttare correttamente il caching del browser in WordPress, qualcosa che CollectiveRay ha un ottimo articolo su qui.
Ma questo non è abbastanza se i file CSS e Javascript sono piuttosto grandi. Questo è ciò che riguarda la minificazione.
Cos'è la minificazione? (e come può beneficiare il tuo sito)
La minificazione è la funzione di prendere un pezzo di codice e rimuovere da esso tutti i caratteri (come spazi, interruzioni di riga, tabulazioni e altro) che non trasmettono alcun significato, tranne che per rendere il testo più leggibile. I file WordPress minimizzati vengono eseguiti Allo stesso modo come il codice originale, con l'unica differenza che occupano un po' less spazio perché tagliano informazioni extra. Per questo motivo, il file diventa più piccolo da scaricare, risultando in un sito Web più veloce nel complesso.
La minimizzazione è particolarmente importante e utile per gli script (come i file Javascript), i fogli di stile CSS e altri componenti di siti web simili.
Per saperne di più: Come assumere (GRANDI) sviluppatori Javascript - I 5 migliori siti, clicca qui - https://www.collectiveray.com/hire-javascript-developer
Il motivo principale per farlo e i vantaggi per il tuo sito sono:
- Ridurre i tempi di caricamento e rendere il tuo sito web più veloce in generale Dato che la maggior parte dei siti Web utilizza diversi script e file di fogli di stile, il che si traduce in MOLTO spazio aggiuntivo. Sebbene tu possa pensare che la rimozione degli spazi non comporterà molte modifiche, il processo completo di minimizzazione di tutti i file di un'installazione di WordPress può aggiungere un vantaggio significativo.
- Oscuramento del codice da lettori occasionali. Sebbene la minificazione risultante non nasconda il codice del tuo sito (cioè questo è diverso dall'offuscamento del codice), ma rende un po 'più difficile da capire per gli utenti occasionali, se è qualcosa che ti preoccupa.
Sebbene minimizzare il codice è improbabile che si crei un file Enorme differenza rispetto ai tempi di caricamento del tuo sito, visto come parte di una strategia di ottimizzazione completa, sarebbe una delle tante cose che dovresti fare. Può ridurre i tempi di caricamento della pagina di un paio di punti percentuali, il che lo rende una buona tattica da implementare comunqueless.
Cosa succede durante il processo di minimizzazione?
In sostanza, il processo di minimizzazione passa attraverso tali file di testo e rimuove tutto ciò che è destinato esclusivamente al consumo umano, perché dopo tutto, la macchina che analizza il file non rende il file leggibile dall'uomo. Il processo minify di WordPress rimuove qualsiasi cosa come spazio bianco extra (spazi, nuove righe, tabulazioni), commenti o qualsiasi altro testo che aumenta la dimensione del file senza diminuire la "semantica" del file per il browser. Il significato è ancora lì, i file sono solo più piccoli.
Ad esempio, questo è l'aspetto di un normale file CSS:
body {
margine: 30px;
padding: 30px;
color: # FFFFFF;
sfondo: # f7f7f7;
}
h1 {
font-size: 12px;
colore # 222222;
margin-bottom: 5px;
}
Mentre la versione minimizzata di questo codice sarebbe simile a questa:
body{margin:30px;padding:30px;color:#fff;background:#f7f7f7}h1{font-size:12px}
Puoi vedere che le informazioni testuali sono esattamente le stesse, sono solo spogliate di cose che sono lì per scopi di leggibilità. Lo stesso concetto si applica ai file Javascript.
Il risultato finale dell'utilizzo di plug-in o mezzi per minimizzare Javascript WordPress sarebbe che l'output HTML, insieme ai file CSS e ai file JS utilizzati dal tuo sito Web e dai suoi plug-in, sarebbe simile a questo:
Anche se questo può sembrare un mucchio di spazzatura, in effetti, tutto il significato è ancora lì - è stato appena "minimizzato" per rimuovere qualsiasi cosa non necessaria che ne gonfia le dimensioni.
Ci sono molti plugin che possono aiutarti a realizzare questo processo, che menzioneremo di seguito.
Minimizza Javascript WordPress
Il processo per minimizzare Javascript WordPress è abbastanza semplice. Devi semplicemente installare uno dei plugin di seguito. Potresti anche notare che i file JavaScript principali di WordPress sono già minimizzati per impostazione predefinita.
Infatti, se dai un'occhiata al codice sorgente del tuo sito WordPress, vedrai l'estensione .min.js, che mostra che i file effettivi sono già minimizzati.
Questo non è necessariamente il caso di plugin e temi di terze parti.
Potresti anche voler fare il passo in più per rimuovere tutti i plugin extra e generare script che potrebbero non essere necessari.
Se sei assolutamente fissato sulle prestazioni, puoi anche scegliere di creare versioni dei file Javascript che includono SOLO lo script utilizzato dal tuo sito web. Per impostazione predefinita, la maggior parte dei file di script ha un codice aggiuntivo incluso "nel caso" sia necessario.
Potresti voler conoscere come farlo qui.
Minimizza CSS WordPress
Ancora una volta il processo di Minify CSS WordPress è semplice. Puoi semplicemente installare un plugin e questo eseguirà automaticamente la minimizzazione dei tuoi file CSS. Sebbene la maggior parte dei file principali di WordPress abbia una versione ridotta dei file CSS, ciò non si applica necessariamente a tutti i plugin e i temi.
Ancora una volta, consigliamo anche di eseguire un esercizio di copertura del codice CSS per rimuovere qualsiasi codice CSS superfluo che è semplicemente un peso morto.
Citeremo una serie di plugin che minimizzano CSS WordPress nella prossima sezione di seguito.
I 5 migliori plugin Minify per WordPress
Discuteremo sia di prodotti generici che vengono utilizzati in generale per rendere il tuo sito web più veloce attraverso la minimizzazione, sia di plugin specifici la cui unica caratteristica è il processo di minimizzazione.
1. WP Rocket
Questo è di gran lunga il nostro plugin preferito.
Il motivo è semplice, questo è di gran lunga il miglior prodotto in grado di eseguire diverse attività di ottimizzazione della velocità, in un modo davvero semplice, ma con un ottimo risultato nel rendere il tuo sito web più veloce, incluso l'esecuzione di una minimizzazione dei file CSS e Javascript WordPress.
Davvero e veramente, è solo una delle cose che fa questo plugin, ma una volta installato, scoprirai che non devi fare nient'altro.
Come puoi vedere di seguito, questa minimizzazione è una delle opzioni di base per l'ottimizzazione. Con ciò, vedrai che c'è la concatenazione, questo è un processo secondario di ottimizzazione, che crea un file da tutti i file CSS e JS (perché questo rende anche più veloce il download dei file)
Il plugin non è gratuito, ma il prezzo è molto economico a soli $ 49. Dato il tempo che ti fa risparmiare e il risultato di velocizzare il caricamento del tuo sito web, letteralmente in pochi minuti, ti consigliamo vivamente di optare per questo.
Installiamo questo plug-in su ogni sito Web WordPress che configuriamo, semplicemente perché ci fa risparmiare così tanto tempo per l'ottimizzazione.
Clicca qui per il prezzo più basso su WP Rocket
2. Ottimizzazione JCH
Ecco un piccolo trucco per aiutarti molto - utilizzare JCH Optimize - questo è uno strumento che funziona su più piattaforme come WordPress, Joomla, Drupal e Magento.
La cosa grandiosa di JCH Optimize è che implementa un numero enorme di file Google Page Speed e altri consigli per caricare il tuo sito web il più velocemente possibile.
È fantastico perché richiede quasi zero configurazione e intervento da parte di un utente.
Se stai cercando un servizio di hosting veloce, dai un'occhiata al nostro host, li abbiamo esaminati completamente qui: https://www.collectiveray.com/inmotion-hosting-review
E non devi scherzare con nessun codice, tutto questo è fatto dal plugin: conserva tutta la tua codifica originale, quindi non romperai nulla facendo confusione. Inoltre, di solito, esegue quelle ottimizzazioni che di solito sono le più difficili da eseguire. Per citarne alcuni, questi sono quelli che sono fatti bene
- Combina i file CSS di tutti i tuoi template, moduli e plugin in un unico file, riducendo così il numero di richieste inviate al tuo sito web
- Combina file Javascript, che di solito sono molto difficili da combinare senza danneggiare il sito
- Comprime CSS e Javascript in modo che diventino più piccoli e il tempo di trasferimento sia ridotto
- Minimizza Javascript e CSS, per renderlo più compatto e ridurne ulteriormente le dimensioni (riduce eventuali spazi bianchi, commenti, ecc.)
- Aggiunge un tag DEFER, in modo che la tua pagina venga caricata per prima ed esegua il Javascript dopo che la pagina è stata caricata, rendendo il sito più veloce da caricare. Dato che questa implementazione specifica è fondamentale per un sito Web veloce, abbiamo trattato ampiamente questo argomento qui: https://www.collectiveray.com/defer-parsing-of-javascript-wordpress-async
- Crea IMAGE Sprites - questo riduce anche il numero di richieste inviate al tuo sito web di una quantità molto elevata ed è una delle ottimizzazioni più difficili da ottenere manualmente
Ti consente anche di modificare alcune opzioni avanzate come l'esclusione di determinati file per assicurarti che se un'estensione non funziona dopo averla eseguita tramite JCH Optimize, funzionerà comunque.
La rotta Versione PRO, che è disponibile a un misero $ 29 ti darà accesso a molte altre opzioni di ottimizzazione come l'inclusione di CSS e Javascript in linea e il caricamento del Javascript in modo asincrono per non bloccare il caricamento del sito.
Credimi sulla parola, installa il plugin, abilitalo e controlla i risultati prima e dopo. Se non ottieni un buon miglioramento, torna qui e lamentati, ma sono abbastanza sicuro che non tornerai :)
Fare clic qui per scaricare JCH Optimize
3. W3 Total Cache
Questo è un altro plug-in che vedrai è un software generico che fa un sacco di cose legate alla velocità di WordPress, inclusa la minimizzazione dei file CSS, JS e HTML.
Mentre scoprirai che questo viene menzionato molto spesso quando si tratta di tali plugin, va notato che questo prodotto non è assolutamente una buona idea per le persone che non sono tecniche.
È noto che crea problemi significativi, con alcuni bug che rimangono anche dopo che il software è stato disinstallato ed eliminato dal sito web.
noi stessi a CollectiveRay abbiamo provato a utilizzare questo plugin diverse volte, ma a questo punto e allo stato attuale, non raccomandiamo più di utilizzarlo per scopi di minimizzazione o per rendere i siti Web più veloci, unless sai esattamente cosa stai facendo.
4. WP Super Minify
Questo plugin utilizza l'estensione Minimizza il framework PHP e utilizzandolo combina, minimizza e memorizza nella cache i file JavaScript e CSS in linea su richiesta per accelerare i caricamenti delle pagine.
Attivando questo plug-in, la sorgente del tuo HTML, JavaScript inline e CSS sono ora rimossi da elementi extra, con il risultato che le loro dimensioni sono più piccole.
Ciò che è diverso dagli altri plugin qui menzionati è che questo plugin esegue SOLO il processo di minimizzazione e nessun'altra ottimizzazione, il che è un'ottima scelta per coloro che vogliono eseguire solo questa funzione e nient'altro per qualsiasi motivo.
5. Minimizza velocità veloce
Sebbene ci siano molti altri plugin minify di WordPress che possiamo consigliare, questo sarà l'ultimo che menzioniamo qui.
Il plug-in Fast Velocity combina tutti i file CSS e JavaScript in modo che il server web debba gestire un minor numero di richieste. Allo stesso tempo, minimizza anche i file e crea copie cache per tempi di caricamento più rapidi.
Questo plugin abilita automaticamente le opzioni per minimizzare il tuo HTML, JavaScript e CSS, ma tu può disabilitarne uno o più manualmente andando nel file Impostazioni → Minimizza velocità veloce scheda.
Puoi scegliere di escludere file specifici dalla minimizzazione se uno dei tuoi plugin si interrompe dopo averlo abilitato.
Avvolgere Up
Sebbene il processo di minimizzazione non sia una funzione rivoluzionaria, dovrebbe essere implementato come una delle numerose attività per rendere più veloce il tuo WordPress e ti consigliamo vivamente di implementare uno dei prodotti sopra menzionati.
Per favore, lasciare un utile commenta con i tuoi pensieri, quindi condividi questo articolo sui tuoi gruppi di Facebook che lo troverebbero utile e raccogliamo insieme i frutti. Grazie per la condivisione e per essere gentile!
Disclosure: Questa pagina può contenere collegamenti a siti esterni per prodotti che amiamo e consigliamo vivamente. Se acquisti prodotti che ti suggeriamo, potremmo guadagnare una commissione per segnalazione. Tali commissioni non influenzano le nostre raccomandazioni e non accettiamo pagamenti per recensioni positive.
e molti altri ...