Leap ottimizza la velocità del tuo sito web con un unico strumento. Leap di Ezoic fa il lavoro di più plugin e include le seguenti 18 caratteristiche (altre vengono aggiunte continuamente!):

CSS

• Critical CSS: rende Critical CSS nel tag head e carica pigramente i fogli di stile. Questo evita che il sito "salti" quando il CSS si carica lentamente. In altre parole, Critical CSS aiuta il tuo sito a caricare meglio non caricando tutti gli stili in una volta, e migliora la velocità mettendo il CSS importante in linea. All'interno della funzione CSS critico puoi anche cliccare sul link "Blocca o evidenzia file specifici (Avanzato)", che ti permetterà di inserire URL specifici che dovrebbero essere processati o saltati dalla funzione CSS critico:

1. Rimuovi il CSS inutilizzato: Rimuove qualsiasi CSS che non è utilizzato dalla pagina corrente e serve una versione minificata del CSS inutilizzato con conseguente riduzione delle dimensioni della pagina e un caricamento più veloce.
2. Rimuovi CSS inutilizzato per pagina: Rimuove tutte le classi CSS che non sono usate su ogni singolo URL e serve una versione minificata del CSS usato su quell'URL. (La funzione Remove Unused CSS deve essere abilitata per utilizzare anche questa funzione).
   ATTENZIONE: Mentre questo dovrebbe aumentare il punteggio di velocità del tuo sito, questo potrebbe causare che il tuo sito sia più lento per gli utenti reali se la maggior parte delle pagine utilizzano lo stesso set di CSS. Questo accade perché l'utente deve scaricare un nuovo file per ogni pagina che visita.
   
   
   

• Ottimizzare i font: I font dichiarati nel foglio di stile in linea sono ottimizzati per prevenire i flash mentre i font vengono caricati, e più chiamate API per i font sono racchiuse in una sola richiesta.

• Precaricare i font: Precarica i font trovati nei file CSS esterni in modo che siano pronti per essere visualizzati più rapidamente senza bloccare il rendering della pagina. Dovresti considerare l'utilizzo di questa impostazione se Pagespeed Insights suggerisce di 'Preload Key Requests' con i file di font come risorse da precaricare.

Immagini

1. Lazy Loading of Images: aiuta il tuo sito a caricare più velocemente caricando le immagini solo quando l'utente le vedrà effettivamente. Le immagini più in basso nella pagina si caricano man mano che l'utente scorre verso il basso. Le uniche immagini che verranno caricate immediatamente sono quelle mostrate nella prima schermata, non le immagini più in basso nella pagina. (Questa funzione deve essere attivata quando si usano le funzioni Next-Gen Formats e Resize Images)

2. Formati Next-Gen: Nei browser supportati, questa funzione servirà immagini in formato WebP - un nuovo formato di immagine progettato per avere una dimensione di file più piccola

3. Ridimensiona immagini: Ridimensiona automaticamente le immagini sulla tua pagina in base alle dimensioni dello schermo dell'utente per minimizzare i tempi di trasferimento mantenendo la qualità dell'immagine.

4. Precaricare le immagini di sfondo: Aggiungi tag di precaricamento per le immagini di sfondo definite nei fogli di stile in linea. Le immagini di sfondo non vengono caricate fino a quando tutti i fogli di stile non sono stati elaborati, quindi questa caratteristica dovrebbe accelerare il caricamento di immagini di grandi dimensioni definite come sfondi.

Criteri efficienti per la cache statica

Questa caratteristica dice al browser di mettere in cache le tue risorse statiche che possono aumentare la velocità del tuo sito perché l'utente non deve scaricare quelle risorse più di una volta. Questa funzione imposterà l'intestazione della cache sulle tue risorse per un periodo di tempo appropriato. Le risorse statiche disponibili che possono essere messe in cache sono:

1. Immagini

2. Fogli di stile

3. Scripts

4. Fonts

Si possono anche impostare alcune regole di cache statica degli URL come segue:

Pre-connetti

1. Pre-connetti le origini: Analizza la tua pagina per identificare altri domini da cui stai richiedendo risorse. Aggiunge poi dei tag per dire al browser di pre-connettersi a quei domini per accelerare il caricamento di quelle risorse.

Minimizza l'HTML

1. Minimizza Javascript: Rimuove gli spazi bianchi non necessari, i commenti e i caratteri dai file JavaScript per ridurre al minimo le dimensioni del carico utile javascript, riducendo il tempo di invio del file all'utente.

2. Minify CSS: Rimuove gli spazi bianchi, i commenti e i caratteri non necessari dai file CSS per minimizzare le dimensioni del carico utile CSS, riducendo il tempo di invio del file all'utente.

3. Minimizzare l'HTML: Rimuove gli spazi bianchi non necessari, i commenti degli attributi e i caratteri dall'HTML per minimizzare le dimensioni della pagina, riducendo il tempo per inviare la pagina all'utente.

Nota che hai l'opzione di 'tenere' certo HTML dall'essere minificato.

a. Mantenere i commenti condizionali di IE: Conserva i commenti condizionali di IE nell'HTML.

b. Mantieni i valori predefiniti degli attributi: Conserva gli attributi predefiniti per i tag.

c. Mantenere End Tags: Conserva i tag finali.

d. Mantenere le virgolette: Conservare le virgolette intorno agli attributi dei tag come type='text/javascript'.

e. Mantenere gli spazi bianchi: Conserva gli spazi bianchi tra i tag in linea ma continua a far collassare più caratteri di spazio bianco in un singolo carattere di spazio bianco.

Esecuzione dello script

1. Ritardo script: Ritarda il caricamento e l'esecuzione di Javascript fino al caricamento del contenuto principale.

Puoi anche impostare le regole di ritardo degli URL come segue. Se vuoi escludere certi URL dal ritardo dello script puoi farlo usando i parametri 'no defer' nel tuo codice. Qui ci sono alcune informazioni su come implementarli:

https://developers.google.com/speed/pagespeed/service/DeferJavaScript

È quindi necessario fare clic su questo pulsante:

E poi la casella di controllo:

In alternativa puoi impostare le 'Regole URL' per escludere che lo 'Script Delay' sia applicato a specifici script, pagine o directory sul tuo sito:

Non sei sicuro di quali script debbano essere esclusi? Puoi usare la funzione 'Trova script in ritardo' per identificare la giusta combinazione di script da escludere.

Inizia impostando tutti gli script su 'no' e poi usa il processo di eliminazione per capire quali script possono essere tranquillamente ritardati ('sì') senza influenzare la funzionalità. Nota che spesso più di uno script dovrà essere escluso ('no') prima di arrivare alla combinazione vincente!

2. Ad Delay: Ritarda il caricamento e l'esecuzione degli annunci fino al caricamento del contenuto primario.

3. Riduci i compiti ad alta intensità di CPU: Rallenta i compiti javascript che stanno usando troppa CPU in modo che il processore del browser abbia tempo libero per renderizzare la pagina. Può influenzare la tempistica delle chiamate SetInterval e SetTimeout.

Contenuti

1. Carica pigramente gli iframes: Questa caratteristica ti permette di caricare pigramente gli iframe che appaiono al di fuori della visualizzazione iniziale dello schermo. Questo aiuta il tuo sito a caricarsi più velocemente caricando gli iframe solo quando l'utente li vedrà effettivamente.

È anche possibile impostare regole di URL per il caricamento pigro degli iframe.

Con queste caratteristiche, i tuoi utenti saranno in grado di interagire con le tue pagine significativamente più velocemente, mentre gli elementi meno essenziali si caricano in background. Per implementare, dovresti caricare Leap e generare una versione.