WP Rocket 3.19: miglioramenti senza sforzo per la migliore LCP e stabilità del layout

Ricordi come le squadre di Formula 1 vincono le gare? Non è solo un grande cambiamento, ma piuttosto molti piccoli miglioramenti che si sommano a lungo termine. La nostra nuova grande versione riflette ancora una volta questa visione di ottimizzazioni incrementali e intelligenti: incontra WP Rocket 3.19!

La nostra ultima versione si concentra sul miglioramento di due funzionalità per renderle accessibili a tutti, indipendentemente dalla loro competenza tecnica. Abbiamo preso processi complessi che richiedevano un'ottimizzazione manuale per pagina per essere efficienti e trasformarli in caratteristiche che funzionano in background, rendendo la loro magia.

I risultati? WP Rocket 3.19 offre un'esperienza utente migliore per i tuoi visitatori grazie al miglioramento della stabilità del layout e alla prevenzione di cambiamenti di contenuti, insieme a una maggiore velocità percepita e un miglior grado di verniciatura più grande.

In WP Rocket, riteniamo che tutti meritino un sito Web veloce, ecco perché troviamo costantemente modi per semplificare l'ottimizzazione della velocità garantendo al contempo che tutti i nostri clienti possano beneficiare delle nostre potenti funzionalità.

Pronti a vedere come questi miglioramenti facili e intelligenti possono aggiungere prestazioni migliori per il tuo sito Web? Ci immergiamo nei dettagli di WP Rocket 3.19 o guardiamo il video qui sotto.

Cosa comporta WP Rocket 3.19

WP Rocket 3.19 introduce due miglioramenti che funzionano dietro le quinte per aumentare le prestazioni del tuo sito web.

Il primo miglioramento è legato ai caratteri Preload: la funzione mantiene lo stesso nome mentre cambia il modo in cui funziona e la sua posizione, come leggerai proprio di seguito.

Il secondo si concentra sull'automazione della funzione Prefetch DNS Richieste, che è stata rinominata preconnect in domini esterni e rimosso dall'interfaccia del plug -in: imparerai il motivo dietro questa scelta nella sezione dedicata.

Caratteri di preload in un clic

Facciamo un passo indietro e comprendiamo cos'è il precarico dei caratteri e perché è importante per le prestazioni del tuo sito web.

Spiegare il precarico del carattere

Il precarico dei caratteri è una potente tecnica di ottimizzazione che può migliorare la velocità con cui appare il testo rapidamente e senza intoppi sul tuo sito Web.

Ecco perché: quando un visitatore viene sul tuo sito Web, il loro browser deve caricare non solo il contenuto delle tue pagine, ma anche i loro caratteri correlati. Senza precarico, ecco cosa succede in genere:

1. Il browser inizia a visualizzare il testo utilizzando un carattere predefinito.

2. Quindi scopre nel tuo CSS che deve caricare un carattere personalizzato, quello che hai scelto.

3. Una volta caricato il carattere personalizzato, il testo cambia per utilizzare questo nuovo carattere anziché quello predefinito.

Questo processo può causare ciò che è noto come un lampo di testo non mandato (FOUT). FOUT è un breve momento in cui il tuo testo cambia improvvisamente l'apparenza come il carattere personalizzato si carica.

Puoi indovinare cosa succede dopo: il layout della tua pagina tende a spostarsi. Un tale spostamento non è solo visivamente sgradevole, ma può anche influire negativamente sul grado cumulativo del turno di layout (CLS), uno dei principali vitali Web di Google.

Il precarico dei caratteri aiuta a risolvere questo problema dicendo al browser che i tuoi caratteri personalizzati sono importanti e devono essere scaricati subito, anche prima di analizzare tutto il codice CSS. Di conseguenza, è più probabile che il carattere personalizzato sia pronto quando il browser visualizza per la prima volta il testo, riducendo o eliminando il cambiamento del carattere e garantendo una maggiore stabilità del layout.

Perché dovresti precaricare i caratteri?

Il vantaggio di precaricare i caratteri ed evitare i turni di layout è strettamente correlato al miglioramento dell'esperienza dell'utente, il che significa offrire un'ottima prima impressione e assicurarsi che i tuoi visitatori siano disposti a rimanere sul tuo sito Web e potenzialmente convertire.

Inoltre, il precarico dei caratteri può anche migliorare il tuo più grande grado di vernice contentosa (LCP), un altro vitale di base che misura la rapidità con cui l'elemento di contenuto più grande sulla tua pagina diventa visibile. Immergendoti nei dettagli, il precarico dei caratteri può ottimizzare le prestazioni LCP quando l'elemento LCP è un nodo di testo, il che è in media un 20% di siti Web tra dispositivi mobili e desktop.

3.19: Meet the New Preload Fonts

Mentre il precarico dei caratteri può portare questi significativi guadagni delle prestazioni, abbiamo notato che i nostri clienti hanno usato a malapena questa funzione o non è sempre stato implementato correttamente. Al contrario: i caratteri di preload si sono rivelati controproducenti per le prestazioni. Ecco perché volevamo rendere questa opzione più semplice e accessibile a tutti i nostri clienti riducendo la sua implementazione errata.

Ed eccoci qui: WP Rocket 3.19 rende i caratteri del precarico un processo automatizzato che puoi abilitare in un clic.

Non è più necessario identificare manualmente i file di carattere corretti e precaricarli per far funzionare efficacemente la funzionalità. Dopo aver abilitato l'opzione, WP Rocket rileva automaticamente, su ogni pagina, quali caratteri vengono utilizzati sopra il tempo e devono essere prioritari, sia dal cellulare che dal desktop. Quindi precarica solo questi caratteri pertinenti, risultando in un'ottimizzazione più precisa ed efficiente.

Questa ottimizzazione fa la differenza perché le risorse inutilizzate per precaricare potrebbero danneggiare le prestazioni. Ad esempio, se un carattere precaricato non viene utilizzato nei primi secondi di caricamento della pagina, browser come Chrome potrebbero emettere un avvertimento. Concentrandosi solo sui caratteri che sono veramente necessari sopra il periodo, la nuova opzione di caratteri preload ti aiuta a evitare questi potenziali problemi e garantisce un precarico ottimale dei caratteri.

Si prega di notare che ora troverai la nuova funzione Preload Fonts nella scheda Media:

Se hanno precedentemente specificato i caratteri specificati, l'opzione automatizzata verrà abilitata per impostazione predefinita.

In conclusione : la funzione di nuovi caratteri Preload ottimizza automaticamente il caricamento dei caratteri, garantendo un'esperienza più fluida per i tuoi visitatori dal momento in cui atterrano sul tuo sito Web - e richiede solo un clic.

Preconnect su domini esterni: un processo automatizzato nuovo di zecca

Per quanto riguarda la funzione precedente, iniziamo spiegando brevemente l'impatto della preconnessione a domini esterni sulla velocità del tuo sito Web.

Preconnect in domini esterni in inglese semplice

Preconnect in domini esterni è una potente tecnica di ottimizzazione che influisce positivamente sul caricamento delle risorse.

Quando il tuo sito Web deve caricare risorse come caratteri o script da domini esterni, il browser deve in genere stabilire prima una connessione a questi domini. Questo processo di connessione può aggiungere un ritardo inutile al processo di download di risorse esterne, influendo su metriche specifiche dipendenti da tali attività esterne.

Preconnect affronta questo problema dicendo in anticipo al browser quali connessioni saranno necessarie. Ciò consente al browser di impostare presto queste connessioni, riducendo il tempo necessario per caricare risorse esterne quando sono necessari.

Questa ottimizzazione offre due vantaggi:

1. Tempo di caricamento migliorato : impostando in anticipo le connessioni, il tuo sito Web può iniziare a caricare più rapidamente risorse esterne e anche le pagine si caricano più rapidamente.

2. Prestazioni migliorate LCP : se il tuo più grande elemento di verniciatura contenente è un carattere da un dominio di terze parti, Preconnect può aiutarlo a caricare più velocemente, migliorando potenzialmente il punteggio LCP.

3.19: dalle richieste DNS prefetch a preconnect ai domini esterni

Abbiamo notato che anche la funzione di prefetch DNS richieste era sottoutilizzata e spesso applicata erroneamente. Ecco perché abbiamo deciso di automatizzare questa opzione, rimuovendola dall'interfaccia del razzo WP e rinominandola per preconnect in domini esterni.

Con WP Rocket 3.19, questa potente ottimizzazione funziona in background e non deve essere abilitata. Ecco perché non troverai più questa funzione nelle impostazioni del razzo WP.

Ecco cosa devi sapere su questo miglioramento:

1. È un processo completamente automatizzato : non è più necessario identificare manualmente quali domini includere durante l'implementazione dell'ottimizzazione. WP Rocket ora gestisce questo automaticamente.

2. Viene applicato solo sulle pagine in cui è necessario, sia su dispositivi mobili che desktop, risultando in un approccio più efficiente e mirato che è coerente su tutti i dispositivi.

Come spiegato sopra, questa funzione può portare a tempi di caricamento della pagina più rapidi e un punteggio LCP migliorato, il tutto senza che tu debba sollevare un dito.

Se si desidera disabilitare la funzione, è necessario applicare il seguente filtro:

 add_filter('rocket_preconnect_external_domains_optimization', '__return_false');

Suggeriamo di disabilitarlo solo se il tuo sito Web ha più di dieci domini da precaricare - in questo caso Edge, è meglio lasciare che il browser gestisca il processo. Sebbene in generale ci siano un paio di domini esterni per pagina, è possibile verificare se questo scenario si applica al tuo sito Web esaminando il codice sorgente della pagina e il numero di occorrenze di preconnect dei dati.

In conclusione : la funzione di preconnect su domini esterni è un nuovo miglioramento automatizzato che imposta connessioni più veloci tra il sito Web e le risorse esterne rimuovendo il rischio di implementazione errata.

Performance perfezionate: ottimizzazioni automatizzate in azione

Parlando delle caratteristiche del razzo WP che funzionano automaticamente, preconnect in domini esterni è l'ultimo e aggiunge a quelli esistenti:

• Pagina Cache (inclusa la cache mobile)

• Ottimizza le immagini critiche

• Rendering automatico pigro

• Caching del browser

• Compressione GZIP

• Supporto incrociato di origine per i caratteri web

• WooCommerce Refresh Framments Cache

• Ottimizza i file di Google Fonts

• Disabilita Emoji WordPress

Tutte queste funzionalità non hanno un'interfaccia utente: funzionano solo. Siate certi che se è necessario, puoi sempre disabilitarli usando un filtro o un plug -in helper.

Queste funzionalità automatizzate sono in cima alle opzioni che si accendono quando si attiva per la prima volta il razzo WP, come Minify CSS e JS, la durata della vita della cache, la cache del preload, i collegamenti di precarico e il controllo del battito cardiaco.

Non c'è da stupirsi che il tuo sito Web ottiene una spinta di velocità non appena abiliti il ​​nostro plugin!

Se sei curioso dell'impatto del mondo reale di queste automazione, tieni presente che i risultati possono variare a seconda del sito Web specifico. Mentre WP Rocket 3.19 offre nuovi miglioramenti, i miglioramenti delle prestazioni che vedrai si sommano ai guadagni di velocità già raggiunti dalle nostre caratteristiche esistenti.

Avvolgimento

WP Rocket 3.19 rafforza il nostro impegno a seguire l'approccio delle "decisioni, non delle opzioni" e a creare ottimizzazioni complesse come processi automatizzati. Ci impegniamo a fare le scelte giuste per te, quindi non devi spendere del tempo e degli sforzi per capire cosa è meglio per il tuo sito web.

Stiamo gradualmente rimuovendo le barriere ad alte prestazioni, garantendo che più utenti possano beneficiare di ottimizzazioni avanzate - e altro ancora deve essere arrivato!

Pronto a vedere come queste nuove funzionalità automatizzate possono aiutare il tuo sito? Aggiornamento a WP Rocket 3.19 o provalo con la nostra garanzia di back-back di 14 giorni. Sperimenta in prima persona come stiamo rendendo l'ottimizzazione più semplice e facci sapere sapere i tuoi pensieri nei commenti!