Evitare il disastro del CMS: come migliorare le prestazioni del sito web

A nessuno piace... aspettare... aspettare ... aspetta ...

Avere un sito che si comporta come un supereroe digitale è un imperativo aziendale, soprattutto quando stai facendo una prima impressione con un potenziale cliente che ricerca la tua organizzazione.

Le seguenti statistiche sulle prestazioni del sito Web dovrebbero suscitare paura nel cuore di ogni sviluppatore e ingegnere del sito, per non parlare del tuo team di marketing del marchio:

• Un utente su due abbandonerà un sito se il caricamento impiega più di quattro secondi. Fonte: BBC.
• Un ritardo di un secondo si traduce in un calo del 16% della soddisfazione degli utenti. Fonte: LoadStorm.
• Il 53% delle visite ai siti mobili viene abbandonato se le pagine impiegano più di tre secondi per caricarsi. Fonte: Google.

Forse hai notato scarse prestazioni del sito quando controlli le metriche delle prestazioni di Core Web Vitals di Google, ma non sei sicuro di come rimediare?

Quando la tua azienda è in gioco, non puoi permetterti di inviare nuovi affari altrove e offuscare il tuo marchio facendo in modo che il tuo sistema di gestione dei contenuti (CMS) offra un'esperienza digitale scadente.

Di seguito diagnostichiamo cinque comuni colpevoli di rallentamento e come migliorare le prestazioni del sito Web utilizzando un CMS agile come WordPress VIP.

Innanzitutto, cosa succede effettivamente quando carichi un'applicazione web?

È una grande richiesta per qualsiasi browser, che deve immediatamente dare il massimo, eseguendo tutta una serie di azioni in pochi millisecondi. Ecco la magra cortesia di Mozilla:

1. Il browser va al server DNS e trova l'indirizzo reale del server su cui risiede il sito web.
2. Il browser invia un messaggio di richiesta HTTP al server, chiedendogli di inviare una copia del sito Web al client. Questo messaggio, e tutti gli altri dati inviati tra il client e il server, vengono inviati tramite la tua connessione Internet tramite TCP/IP.
3. Se il server approva la richiesta del client, il server invia al client un messaggio "200 OK", che significa: "Certo che puoi guardare quel sito Web! Ecco qui." Quindi inizia a inviare i file del sito Web al browser come una serie di piccoli blocchi chiamati pacchetti di dati.
4. Il browser assembla i piccoli frammenti in una pagina Web completa e te la mostra.

Nota: ovviamente, non è così facile come tutto questo. Ci sono una moltitudine di passaggi più piccoli tra ciascuno di questi. Per ora, esaminiamo cinque motivi chiave per cui si verifica la "lentezza" e come il nostro CMS VIP WordPress li mitiga.

Quindi, cosa causa un'esperienza di navigazione lenta?

Colpevole 1. Mancanza di PoP e CDN

Molto probabilmente, la tua attività è globale. Ciò aumenta la sfida logistica di garantire connessioni veloci, coerenti e stabili per gli utenti su una varietà di tipi di connessione su una varietà di dispositivi.

Quindi cosa significa questo per la tua applicazione?

Quando una richiesta di rete viene avviata dal passaggio 2 precedente, la richiesta passa attraverso più hop di rete. Un hop è un termine di rete di computer che si riferisce al numero di router attraversati da un pacchetto, dalla sua origine alla sua destinazione.

Come conseguenza di questi salti dalla posizione geografica di un utente al tuo server, è possibile che i tuoi utenti subiscano più tempo durante il caricamento. Questo può essere mitigato servendo il contenuto più vicino al tuo visitatore, tramite una rete di distribuzione dei contenuti (CDN) e punti di presenza (PoP).

La risposta VIP di WordPress :

La CDN di WordPress VIP è una rete globale di PoP edge e di origine che servono il tuo sito a clienti globali, nel modo più rapido, efficiente e affidabile possibile. Questa disponibilità localizzata avviene automaticamente non appena i nostri server perimetrali vengono informati di nuovi contenuti dalla tua applicazione. Ciò significa che non vi è alcuna configurazione aggiuntiva che deve essere gestita dal tuo team, sollevandoli per concentrarsi su altre attività.

Colpevole 2. Supporti non ottimizzati

Quelle immagini di alta qualità che tutti stanno riprendendo oggi con gli ultimi dispositivi mobili sono piuttosto belle! Cioè, fino a quando non vengono utilizzati come miniature sulla tua home page.

L'aggiunta di un'immagine 4K e la limitazione a un contenitore di 100 × 100 pixel significa che gli utenti devono caricare l'intera immagine 4K. Una singola immagine non è molto di cui preoccuparsi, ma per le aziende che pubblicano contenuti su larga scala, il caricamento della pagina può facilmente esplodere in modo esponenziale più articoli popolano una pagina indice.

La risposta VIP di WordPress :

Le applicazioni su WordPress VIP ricevono automaticamente tutti i vantaggi delle immagini memorizzate nella cache edge e il ridimensionamento automatico delle immagini sulle immagini caricate. Inoltre, le immagini possono essere ridimensionate al volo.

Colpevole 3. Javascript e CSS non ottimizzati

Quando si caricano file di grandi dimensioni, ogni bit e ogni richiesta conta. Se hai già ottimizzato il numero di hop di rete necessari per scaricare un file, il tempo maggiore che un file impiega per arrivare è per l'apertura e la chiusura delle richieste.

Per risolvere questo problema, lo sviluppo moderno di Javascript e CSS utilizza spesso la minimizzazione e la concatenazione.

La minimizzazione si riferisce alla rimozione di tutti i caratteri non necessari in un file, normalmente tutti gli spazi bianchi non necessari. L'obiettivo qui è ridurre il numero totale di bit trasferiti.
La concatenazione è l'atto di incollare più file insieme per produrre un file più grande. L'obiettivo qui è ridurre il numero di richieste di rete.

La risposta VIP di WordPress :

WordPress VIP concatena automaticamente i file JavaScript e CSS per ridurre il numero di richieste che si verificano durante il caricamento di una singola pagina. I file CSS vengono minimizzati e concatenati. Il merito va al nostro plugin open source preferito.

I file minimizzati e concatenati vengono quindi memorizzati nella cache per 15 giorni o fino a quando non viene rilevata una modifica.

Colpevole 4. Scarso utilizzo della cache

Le cache sono una speciale memoria temporanea per velocizzare le cose. Ciò che accelerano dipende dal tipo di cache.

Se non stai utilizzando una forma di memorizzazione nella cache, potresti avere un grave impatto sulla velocità di risposta della pagina quando l'applicazione è sotto carico.

La risposta VIP di WordPress :

WordPress VIP utilizza diversi tipi di memorizzazione nella cache:

• Cache oggetti : utilizzata per memorizzare i dati a livello di applicazione. Questo aiuta a recuperare i dati in modo rapido ed efficiente senza colpire il database. In breve, la cache degli oggetti impedisce che calcoli e/o query estesi occupino tempo di connessione prezioso.
• Cache delle query: memorizzazione nella cache leggera delle query del database. In WordPress, qualsiasi query di post che utilizza l'API WP_Query trae grandi vantaggi da questa forma di memorizzazione nella cache.
• Cache della pagina: archiviazione di una pagina completamente disegnata, archiviata in ciascuna posizione PoP perimetrale. Questo è il primo livello di cache che incontra la maggior parte degli utenti che visitano la tua applicazione. La cache della pagina consente alla nostra CDN di fornire contenuti localizzati senza che la tua applicazione esegua mai una riga di codice.

Tutti questi funzionano in armonia per ridurre i tempi di risposta delle richieste.

Problema 5. Saturazione della connessione al database

Quando il contenuto dell'applicazione e la base di utenti crescono, le query di database meno recenti che inizialmente funzionavano correttamente possono ora ridurre le prestazioni.

Quando le query richiedono tempo per l'esecuzione, questo occupa una posizione nel database fino al termine della query. A volte queste postazioni si riempiono molto rapidamente, impedendo successivamente l'esecuzione di più query. Ciò si manifesta comunemente come prestazioni dell'applicazione ridotte fino a quando il database non fornisce 500 risposte.

La saturazione della connessione può verificarsi in modo rapido e casuale, rendendo difficile la diagnosi della causa principale.

La risposta VIP di WordPress :

Come parte del pacchetto di servizi VIP di WordPress, forniamo l'accesso a New Relic, che aiuta a diagnosticare e monitorare in modo proattivo potenziali problemi come quelli sopra. Ciò consente al tuo team di risparmiare tempo, costi e il problema di proteggere strumenti e risorse aggiuntivi quando i secondi contano.

In conclusione

Da salti di rete e mancanza di presenza di punti alla saturazione del contenuto del database, affrontare le cause principali delle scarse prestazioni del sito Web dovrebbe essere una priorità P0 per qualsiasi organizzazione lungimirante e il suo sistema di gestione dei contenuti. Dopotutto, nell'era digitale fare quella prima impressione fantastica con un pubblico è tutto. Perché la velocità uccide davvero.

Scopri di più su WordPress VIP qui.

Autore

Michael Chan, Senior Software Engineer, WordPress VIP