DE{CODE}: 6 trucchi per sviluppatori WooCommerce per la creazione di siti Web di e-commerce veloci

Accanto alle vendite, la velocità del sito è forse la metrica più importante per i tuoi siti di e-commerce. Perché? I siti Web di e-commerce veloci ottengono più traffico, hanno tassi di conversione più elevati, tassi di rimbalzo inferiori e generano più visitatori di ritorno. In questa sessione, Jeremy Benoit, Senior Product Manager di WP Engine, e Catherine Kelly, Engineering Manager, esplorano i trucchi degli sviluppatori, le funzionalità di WP Engine e altri strumenti per rendere il tuo negozio WooCommerce ancora più veloce.

Slide della sessione

Trascrizione del testo completo

JEREMY BENOIT : Salve a tutti e benvenuti a DE{CODE} 2022. Questa è la traccia dell'e-commerce. Sono Jeremy Benoit, senior product manager di WP Engine e siamo qui per parlare di sei suggerimenti per migliorare le prestazioni di WooCommerce. Insieme a me oggi ci sarà la mia collega, Catherine Kelly e cominciamo.

Quindi inizierò condividendo una citazione di uno dei nostri ingegneri del software, Chris Weigman. E come ha detto, secondo Google, il 53% degli utenti lascerà un sito se la velocità di caricamento della pagina impiega più di tre secondi. Ciò significa che hai esattamente tre secondi per ottenere tutti i dati sulla pagina del prodotto, tutte le immagini che gli hai inviato, tutte le informazioni a riguardo, tutti i piccoli widget e annunci e questo ti mostrerà un po' perché noi' Parliamo di velocità oggi, perché la velocità di un'esperienza di acquisto è fondamentale.

La velocità della pagina è il tempo di caricamento di una singola pagina e può essere misurata in vari modi. Due modi fondamentali sono Time To First Byte, che viene utilizzato da Google PageSpeed ​​Insights, o Time To Full Page Load o Last Byte, che spesso riflette l'esperienza degli acquirenti. La velocità della pagina influisce anche sui tassi di conversione sul tuo sito di shopping e avrà anche un impatto sulla SEO del tuo sito di e-commerce.

Un aspetto fondamentale della velocità è l'hosting eccellente per la qualità della tua esperienza di acquisto. Alla piattaforma ottimizzata per il calcolo di WP Engine forniamo un'esperienza di e-commerce migliorata per prestazioni migliori su tutti i tuoi contenuti di acquisto, statici o dinamici. E parleremo di questi due diversi tipi di contenuto qui in appena un secondo mentre diamo il via ai 6 suggerimenti e trucchi. Ora lo consegnerò alla mia collega, Catherine.

CATHERINE KELLY : Salute. Grazie per questo, Jeremy. Oggi tratteremo sei suggerimenti in relazione a WooCommerce, alla sua configurazione e alla creazione di un negozio di e-commerce. Per alcuni di voi sviluppatori esperti, questi suggerimenti e consigli vi saranno abbastanza familiari, ma per alcuni dei nuovi sviluppatori potreste ottenere alcune informazioni utili.

Quindi oggi copriremo WooCommerce e memorizzazione nella cache, ottimizzazione dei media, ottimizzazione della ricerca, frammenti del carrello Ajax, tabella degli ordini personalizzati e velocità di headless. Quindi per il primo che tratteremo è WooCommerce e la memorizzazione nella cache. Prima di entrare in questo, vogliamo capire quali sono le diverse opzioni che hai in relazione alla memorizzazione nella cache, di cosa si tratta, e quindi possiamo avvicinarci a come apportare miglioramenti.

Quindi la memorizzazione nella cache può dare l'impressione di essere un Santo Graal in relazione ai problemi di prestazioni. Quando in effetti, la memorizzazione nella cache è stata originariamente creata non in relazione alle prestazioni, ma in realtà era per i computer avere una risposta automatica alla stessa richiesta più e più volte, piuttosto che doverla ricalcolare ogni volta. La memorizzazione nella cache è una tecnica che viene utilizzata per archiviare temporaneamente una risposta a una richiesta e quindi per fornire la stessa risposta alla stessa identica richiesta alla stessa risorsa in un momento successivo.

Quindi è un po' come uno di quei bambini fastidiosi - il tuo bambino fastidioso che ti farebbe la stessa domanda più e più volte, ogni singolo giorno, come perché, perché, perché, e tu vuoi solo dare una risposta automatica. E questo può funzionare davvero bene e quando fornisci informazioni statiche per siti statici, dai sempre la stessa risposta. Tuttavia, questo approccio non funziona molto bene per quanto riguarda l'e-commerce, perché mette i bastoni tra le ruote perché le richieste che vengono inviate al server ogni volta non saranno sempre le stesse e devi gestire e controllare in relazione ai carrelli, richieste diverse provenienti da utenti diversi contemporaneamente.

Vuoi anche ricordare le transazioni precedenti che hai in relazione ai tuoi clienti, cosa c'è nel loro carrello, vuoi ricordare cosa non è più disponibile nel tuo negozio in modo che il carrello possa riflettere accuratamente ciò che viene servito a quell'utente. Vuoi anche assicurarti in relazione alla memorizzazione nella cache di non dare un carrello correlato al cliente A al cliente B, e loro possono effettivamente vedere ciò che qualcun altro sta effettivamente ordinando, fondamentalmente perdendo informazioni, che non vuoi . C'è un equilibrio finito che puoi avere in relazione alla memorizzazione nella cache che tu, che è piuttosto difficile da offrire quando stai tentando di offrire un tocco personale ai tuoi clienti in modo che rimangano coinvolti sul tuo sito. Quindi i diversi livelli e tipi di cache che abbiamo: una cache del server.

E la cache del server è generalmente come qualsiasi altra cache. È fondamentalmente la cache che si trova sul tuo server in termini di quando crei la pagina e la servi a una particolare richiesta. Quando ti trovi proprio accanto a quel server e fai una richiesta, la tua risposta può essere istantanea. Tuttavia, quando sei a circa 1.000 chilometri di distanza, come il tuo individuo o utente di e-commerce, la risposta può richiedere molto tempo per raggiungerli.

Quindi hai la cache dell'applicazione. E la cache dell'applicazione in WordPress e WooCommerce, puoi utilizzare i plug-in per gestirla. plug-in come W3 Total Cache, WP Rocket hanno tutti opzioni per la gestione della cache in-application e questi plug-in fondamentalmente memorizzano una versione temporanea di una pagina richiesta e un file sui loro server. Questo può essere– tuttavia, questo può essere un modo molto inefficiente di memorizzazione nella cache e non dovrebbe essere utilizzato se hai la possibilità di memorizzare nella cache sul server stesso o in un servizio come i domini accelerati o Cloudflare, che distribuisce la cache a livello globale.

Quindi hai la cache del browser. E la cache del browser è fondamentalmente la cache dell'utente finale. Ad esempio, hai mai sperimentato qualcosa su un sito che hai aggiornato e non lo vedi automaticamente nel front-end quando stai sviluppando e rivedendo il tuo sito? Questo perché è stato memorizzato nella cache di quel browser effettivo. È fondamentalmente una versione temporanea di quella pagina o risorsa memorizzata nel browser del tuo utente sul tuo computer o telefono.

È lì quindi non devi scaricare la stessa pagina o risorsa più volte per velocizzare la visualizzazione di quella pagina, che funziona, ancora una volta, abbastanza bene quando hai un sito statico. Ma quando hai un sito dinamico come un sito di e-commerce, cerchiamo sempre di offrire prodotti, descrizioni e informazioni. Può essere– non è così efficace come vorresti.

Quindi hai quella che è nota come cache CDN proxy. Una cache CDN proxy è una cache che si trova tra il server di origine, ovvero il server che sviluppa e presenta la prima pagina originale, e il browser dell'utente stesso. Sono domini accelerati e Cloudflare è un tipo di CDN proxy. E tutte le richieste e le risposte passano attraverso i loro domini prima di raggiungere il server originale.

È essenzialmente un gruppo di server posizionati strategicamente in tutto il mondo con lo scopo di accelerare la consegna di un contenuto statico per i tuoi utenti. Quindi è quasi come se si trovassero proprio accanto al server di servizio originale quando sono a 1.000 miglia di distanza. Quindi accelera la pubblicazione di quella pagina. E una volta che le tue risorse statiche vengono memorizzate nella cache su tutti i server perimetrali in una posizione particolare, tutti i successivi visitatori e le richieste di informazioni statiche vengono fornite dai cosiddetti server perimetrali, anziché dal server originale, riducendo così il carico e accelerando le prestazioni e migliorando la scalabilità.

Quindi tutto funziona molto bene in generale per quanto riguarda i siti statici come accennato. Ma le cache dell'e-commerce mettono una chiave inglese nel lavoro. E l'e-commerce: il motivo per cui c'è una chiave inglese nelle opere è in relazione alle tue pagine di accesso, ai tuoi carrelli, alle tue casse, alle tue liste dei desideri, che si aggiornano dinamicamente tutto il tempo. Quindi non sono statici come si richiederebbe su un normale sito di blog, ad esempio.

In genere, puoi memorizzare nella cache la richiesta GET. E con le richieste GET, o come suggerisce il nome, una richiesta per ottenere qualche risorsa. Anche se le richieste GET sono spesso sicure da memorizzare nella cache, come accennato, non si desidera memorizzare nuovamente nella cache la pagina di accesso, i carrelli e le casse. Vuoi servirli sempre il più freschi e nuovi possibile al cliente, in modo che siano aggiornati e accurati.

Quindi non vuoi consegnare qualcosa dal carrello e non scrivere– non scriverlo con la cache. Generalmente, quando hai qualcosa nel carrello, la maggior parte dei server ignorerà completamente la cache. Quindi, sei tornato al problema di servirlo dal tuo server originale piuttosto che dal tuo CDN. Quindi quello che devi fare è essere intelligente e capire, OK, come posso servire elementi statici dal mio provider CDN ma applicare sempre la dinamica dal mio vero server originale in modo che tutto sia aggiornato e accurato?

Quindi le cose a cui prestare attenzione– per la cache del server, poiché il server genera la pagina Web, la memorizzazione nella cache del server gli consente di ricordare parti della pagina sull'intera pagina che non viene generata da zero ogni volta. E con la memorizzazione nella cache del browser, questo aiuta il browser a ricordare l'aspetto di una pagina Web, quindi non deve perdere tempo a scambiare dati con il server. E questo è utile, come detto, per i visitatori che stanno accedendo a più pagine perché possono esserci file statici. Ad esempio, fogli di stile e file JavaScript possono essere tutti archiviati nel browser.

Quindi, per le migliori pratiche relative alla memorizzazione nella cache, memorizza sempre l'HTML in modo selettivo. Fondamentalmente, come primo livello, memorizza tutto nella cache per agire come un anonimo statico, per un contenuto anonimo statico. E poi cerca di bypassare la cache sui cookie e memorizza nella cache tutto ciò che è nel tuo carrello, nella tua lista dei desideri utilizzando un cookie per bypassare particolari elementi della cache. E poi imposta sempre la tua età cache, il tuo tempo per vivere, con esso per quanto riguarda la tua configurazione Cloudflare. Ciò dovrebbe garantire che la tua cache sia sempre aggiornata e corrisponda all'origine originale.

Quindi una delle cose che capiamo parlando con i nostri clienti di e-commerce è che questo è un problema che generalmente gli sviluppatori devono risolvere da soli. Quindi, come parte del nostro sviluppo in WP Engine, stiamo attualmente lavorando a una soluzione specifica per l'e-commerce, che consente, per impostazione predefinita, la fornitura e l'installazione di WooCommerce con tutte queste regole di memorizzazione nella cache impostate per impostazione predefinita. Quindi mettiamo nella cache tutte le cose statiche e poi non memorizziamo nella cache tutte le cose dinamiche, quindi è sempre fresco. È sempre aggiornato continuamente per te. E quindi, non hai conflitti come la frammentazione del carrello per i tuoi utenti.

Ottimizzazione dei media: un'altra cosa fondamentale per quanto riguarda la consegna di contenuti dal tuo server al tuo utente finale, che si trova sul tuo sito di e-commerce, riguarda l'ottimizzazione dei media. La prima cosa a cui pensare è: cos'è l'ottimizzazione dei media? Cosa possiamo fare al riguardo? E come possiamo garantire che i clienti abbiano un'esperienza veloce, efficace e dinamica durante la navigazione e l'utilizzo del loro sito?

Quindi, per quanto riguarda immagini e video, richiedono diversi tipi di ottimizzazione, ancora una volta, per offrire ai tuoi clienti un'esperienza ottimale in base al dispositivo che stanno effettivamente utilizzando. Quindi l'ottimizzazione dei media è un processo di utilizzo dei migliori strumenti, strategie avanzate ed esperimenti, perché vuoi sempre sperimentare per offrire le prestazioni di un sito di e-commerce. Vuoi l'ottimizzazione delle risorse. Cerca di trovare l'equilibrio tra efficienza e affidabilità.

Quindi vuoi fornire sempre i contenuti per i tuoi clienti nel modo più veloce possibile che non finisca per essere dannoso per le prestazioni del tuo sito. Desideri offrire i contenuti più belli nel minor tempo possibile prendendo in considerazione le diverse piattaforme e risorse su cui i contenuti multimediali possono essere consumati, ad esempio un laptop, un PC o un dispositivo mobile e, poiché spostati nel mondo di dispositivi senza testa, diversi tipi di dispositivi come schermi TV, iPad e cose del genere, dove i contenuti possono essere consegnati anche da un negozio di e-commerce e consumati.

Quindi quello a cui vuoi pensare è migliorare l'ottimizzazione delle immagini per migliorare il Web: le prestazioni del tuo sito per generare più traffico, aumentare quelle conversioni, aumentare le entrate per il proprietario del tuo negozio, per il tuo marchio o per il tuo commerciante. E uno degli aspetti più critici dell'ottimizzazione del sito Web, ha un impatto sulla ricerca e sull'ottimizzazione. Quindi, se le tue immagini e il tuo video sono veloci e veloci, ottieni effettivamente una valutazione migliore per quanto riguarda l'ottimizzazione dei motori di ricerca.

Ottimizza le risorse non solo rende i tuoi prodotti più attraenti e più visibili ai potenziali clienti, ma li fa anche apparire più spesso nella ricerca, ancora una volta, l'ottimizzazione dei motori di ricerca. Le cose fondamentali da ricordare sono guardare al caricamento lento per immagini e video. Il caricamento lento è fondamentalmente una strategia per identificare le risorse non bloccanti o non critiche e caricarle solo quando necessario. Quindi il contenuto, fondamentalmente above the fold, viene caricato e visualizzato all'utente come priorità e quindi ritardiamo tutto il resto del rendering per tutto ciò che si trova sotto questa schermata, quindi qualsiasi cosa scorra verso il basso.

Questa tecnica di ottimizzazione consente di visualizzare prima le prime immagini e i primi contenuti che l'utente vedrà. E poi non sprechiamo risorse scaricando cose che in realtà non vedranno e non vedranno ancora. Google stesso consiglia il caricamento lento e si riferisce ad esso come rinvio delle immagini fuori schermo, in pratica. E poi direi di non preoccuparti di caricarlo.

Puoi manualmente, come sviluppatore, taggare ciascuna delle tue immagini se lo desideri o il tuo video come caricato lentamente. Ma come puoi immaginare per un sito di e-commerce, farlo sarebbe uno sforzo piuttosto pesante. Inoltre, se non ti senti a tuo agio nel taggare manualmente ciascuna di queste immagini, puoi utilizzare un plug-in per farlo. Se hai una rapida ricerca su Google per i migliori plug-in di caricamento per WordPress, ci sono alcuni consigli lì per i migliori plug-in da utilizzare.

Ma per noi e nell'e-commerce, consigliamo di inserirli, ad esempio, in WP Rocket. Offre l'ottimizzazione del caricamento lento di Adobe. Anche le cose che vuoi considerare sono sempre ricordare i tuoi utenti mobili. I loro schermi e le loro prestazioni sono più piccoli, quindi non è necessario caricare immagini enormi. Vuoi ridimensionarlo.

Vuoi usare la compressione per tutte le tue immagini, perché ciò farà risparmiare enormemente, il 40%, sulla larghezza di banda e ovviamente anche il caricamento di quel particolare schermo e formato di file è la chiave per le immagini. Ad esempio, poiché l'immagine 600 per 600 in JPEG è di 100 kilobyte, PNG è di 216, mentre un WebP è di soli 56 kilobyte. Quindi vuoi stare molto attento nel considerare, OK, qual è il formato di file che userò per tutte queste immagini che verranno servite? Soprattutto da un sito di e-commerce, potrei potenzialmente avere migliaia di prodotti, migliaia di immagini e centinaia di video per eseguire il backup di quelle immagini e anche di quel contenuto.

Vuoi sempre ridimensionare le tue immagini. Puoi guardare strumenti online come Imagify, Youoptimizer, TinyJPG e guardare quelli per ottimizzare le tue immagini in WordPress. Imagify è realizzato dallo stesso team di WP Rocket ed è un plug-in molto intuitivo che comprime automaticamente le immagini utilizzando tre diversi tipi di livelli: normale, aggressivo e ultra. E ti consente di personalizzare la dimensione dell'immagine adatta ai tuoi utenti finali.

Prestare attenzione anche alle dimensioni delle miniature. Tienili piccoli, perché sono comunque piccoli. Mantieni gli sfondi semplici. Usa strumenti come remove.bg e Slazenger per rimuovere gli sfondi e aggiornare gli sfondi per semplificarli. E anche quindi utilizzare un CDN per una consegna globale più rapida. Sempre, inoltre, con le tue immagini, allega sempre etichette utili alternative a quelle immagini.

Questo aiuta con SEO, ottimizzazione dei motori di ricerca. E assicurati sempre che le tue etichette riflettano effettivamente il contenuto della tua immagine o del tuo video. Come sviluppatori, a volte possiamo fare abbreviazioni come RDHD o semplicemente usare una banda Y. Sappiamo che è un cappello rosso con una fascia gialla. Ma SEO non saprebbe che è così, quindi cerca di essere più reale o linguaggio in termini di presentazione dell'immagine.

Quindi anche l'ottimizzazione video, usa gli strumenti di compressione dei dati. Ancora una volta, ricorda i tuoi utenti mobili. Converti tutto, se possibile, in formati HTML5. Per qualsiasi video privo di audio, rimuovi completamente l'audio. Non ha senso averlo perché consuma solo larghezza di banda. Usa di nuovo le reti di distribuzione dei contenuti. Specifica i tuoi siti di video e ancora, anche per quanto riguarda il lazy loading, rimanda sempre il caricamento di quelle immagini fino a quando la tua pagina non sarà completamente scaricata.

Ottimizzazione per i motori di ricerca: come forse sappiamo, l'ottimizzazione della ricerca è fondamentalmente un metodo di ciò che chiamiamo scaricare la tua ricerca su un particolare fornitore di servizi che è esperto in questo perché può aumentare l'efficacia della tua ricerca e quindi aumentare le tue vendite per il tuo commerciante e utente. Come sappiamo per impostazione predefinita, WooCommerce è dotato di una funzione di ricerca integrata. Ma lascia molto a desiderare in relazione alla funzionalità relativa alle corrispondenze per gli attributi del prodotto, i campi personalizzati e le descrizioni. È molto lento. Non offre una buona esperienza utente. E alla fine della giornata, è molto inefficace.

Se fai una ricerca per– una ricerca di prodotti per quanto riguarda WooCommerce, è una caratteristica comune per quanto riguarda il fatto che non funziona nel modo desiderato. In realtà, quello che vuoi fare è avere una funzione di ricerca che abbia una forte tolleranza agli errori in modo da non interrompere il percorso del cliente. Vuoi che siano in grado di avere un completamento automatico della query forte e di averlo in un'elaborazione del linguaggio naturale per ottenere risultati migliori, tutto ciò che manca nella ricerca di WooCommerce.

Inoltre, desideri disporre di una funzione relativa all'analisi completa per migliorare facilmente i rapporti in modo da poter effettivamente esaminare e vedere l'efficacia della tua ricerca che hai creato in termini di risposte, cosa cercano i tuoi clienti, quanto bene corrisponde per quanto riguarda i prodotti, e quindi quali modifiche puoi apportare nella configurazione per aiutarlo effettivamente? Fondamentalmente, aiuta i tuoi clienti a trovare ciò che stanno cercando più velocemente.

E quindi cosa possiamo fare? Come ho già detto, ciò che facciamo è ridurre l'attrito nell'esperienza di ricerca e aiutare i clienti a trovare ciò che desiderano, utilizziamo l'offload della ricerca. Quindi è un processo fondamentalmente eseguito da una terza parte. Migliora la capacità di ricerca di WooCommerce perché è integrato con Woo. Ha fondamentalmente widget per il filtraggio di cui hai bisogno. Fornisce risultati agli utenti, che possono aiutare a migliorare la fiducia del marchio.

Ha il suggerimento automatico e puoi configurare e personalizzare la ponderazione. Puoi fornire risultati ai clienti, risultati personalizzati. Puoi avere la ricerca automatica istantanea e l'analisi della ricerca, come ho già detto, il che è fondamentale. Non ha senso avere una ricerca se non puoi analizzare la ricerca per vedere quanto sia efficace. E aiuta anche in relazione alla messa a punto della tua integrazione SEO per garantire che i clienti possano trovare ciò che vogliono. Quando vanno alla ricerca su Google, vanno su questo particolare sito in base a ciò che stai cercando.

Aiuta anche a scoprire l'intenzione del cliente e rivela i dati sugli interessi dei clienti. Cosa stanno cercando? Cosa stanno cercando di acquistare? Cosa li attrae verso il tuo sito? Cosa stanno cercando?

Il nostro consiglio sulla ricerca è cercare il completamento automatico. Quindi dai suggerimenti in relazione a questo. E avere sempre la correzione degli errori abilitata. Quindi, se qualcuno ha digitato qualcosa che non è corretto in relazione a un prodotto, cerca di non ricordarlo. Cerca di ricordare sempre l'ortografia o la descrizione corretta in relazione a un prodotto. Mai, quando hai abilitato la ricerca nel tuo sito, permettere a un utente di raggiungere un vicolo cieco.

Avere sempre una pagina. Anche se stanno cercando qualcosa che non è sul tuo sito, indirizzali a una pagina che dice che al momento non possiamo trovare quel particolare prodotto. Si prega di contattare il nostro reparto vendite e così via, e possiamo aiutarvi a farlo. Questa è un'esperienza migliore per quel particolare utente e genererebbe anche fiducia con quel cliente.

Ottimizza sempre. Mentre esegui ricerche analitiche basate su ciò che i clienti cercano, ottimizza in relazione a quei termini in modo che quando altri clienti tornano a cercarli possano effettivamente scoprirli. Usa tag, titoli e descrizioni su tutti i tuoi prodotti. Sono il pane e il burro della tua ricerca.

Quindi assicurati che tutti i tuoi dati siano accurati, riflettano qual è il prodotto e descrivi sempre il più possibile i singoli prodotti che si trovano su un particolare sito commerciale. Configura la tua ricerca per il cellulare. E la ricerca mobile è un po' diversa dalla ricerca su laptop in termini di sito web, diciamo. Assicurati solo di averlo configurato e abilitato nella tua ricerca. E fai sempre riferimento alle tue analisi.

In termini di WP Engine, abbiamo stretto una partnership con ElasticPress per offrire, fondamentalmente, quello che riteniamo essere un plug-in di ricerca premium che è automaticamente predefinito e installato come parte della nostra offerta di e-commerce. Offre tutti i suggerimenti automatici, la ponderazione, i risultati dei clienti e molti altri.

E ora sono abbastanza completo sui miei tre suggerimenti in relazione ai consigli, alla guida per WooCommerce e lo restituirò a Jeremy. Quindi eccoti qui, Jeremy. Grazie.

JEREMY BENOIT: Un'altra area da esaminare è il frammento del carrello AJAX. Il frammento del carrello AJAX è un pezzo di codice ricercato. È noto per la generazione di ritardi, la causa di picchi del server e l'esecuzione inutilmente. Ma il frammento del carrello AJAX è davvero così grave?

Bene, il suo scopo è aggiornare il carrello con nuovi prodotti, nuovi prezzi dei prodotti, nuove quantità di prodotti, calcolare i prezzi senza forzare il ricaricamento della pagina. Lo script dell'agente dei frammenti di carrello, tuttavia, viene eseguito su ogni pagina: la home page, la pagina del prodotto e persino le pagine in cui non sono presenti azioni di aggiunta al carrello. Potrebbe essere la tua pagina su di noi o anche la tua pagina di contatto.

Ora, questa esecuzione o questa esecuzione è spesso il colpevole di, a volte, picchi del server o risorse non necessarie utilizzate che interrompono le prestazioni del tuo sito e l'esperienza del tuo acquirente. Ora idealmente, il frammento del carrello AJAX dovrebbe essere eseguito solo dove hai un'azione di aggiunta al carrello o se hai un carrello dinamico sul tuo sito in cui un'azione può essere utilizzata per aprire o interagire dinamicamente con il carrello. Quindi cosa si può fare per il frammento del carrello AJAX?

Bene, molto spesso, le persone suggeriscono, come facciamo noi, di disabilitare quel frammento del carrello e ci sono due modi per disabilitare il frammento del carrello AJAX. A, vuoi aggiungere un plug-in che ha una capacità di disabilitazione del frammento del carrello. Ci sono alcuni plug-in là fuori che possono disabilitare il tuo frammento del carrello. Ma l'altro mezzo è che se hai familiarità con la modifica di php, puoi disabilitare la frammentazione del carrello modificando il file functions.php del tuo tema.

Ci sono alcuni rischi. Alcuni widget del carrello potrebbero riscontrare problemi quando hai disabilitato il frammento del carrello. Quindi vuoi testare i widget del tuo carrello dopo averli disabilitati per assicurarti che funzionino come desiderato.

Ora il prossimo trucco o suggerimento è utilizzare la tabella degli ordini personalizzati una volta rilasciata. Potresti chiedere, cosa intendi? Molto più tardi, in questo– in DE{CODE}, sentirai parlare da WooCommerce della nuova tabella degli ordini personalizzata che verrà rilasciata entro la fine dell'anno. E la tabella WooCommerce è– la tabella degli ordini ha un dilemma di struttura. Molti di voi sanno che questo è spesso indicato come il motivo di uno scarso ridimensionamento. Ma può anche essere un problema di velocità quando ci si relaziona con interazioni che riguardano prodotti, o interazioni che riguardano ordini e, a volte, anche dati plug-in.

In questo momento, WooCommerce utilizza la meta tabella post che memorizza una varietà di entità di dati, inclusi ordini e prodotti, e alcuni dati di plug-in aggiunti e ogni volta che c'è una chiamata per una di queste entità, colpiscono tutte il stessa fonte. Quindi puoi immaginare che alleviare quell'ingorgo creando tabelle degli ordini personalizzate aggiungerà un'integrità strutturale di WooCommerce di un vero motore di e-commerce e migliorerà la velocità di qualsiasi tipo di attività di ordine. Questo sarà un grande supporto, soprattutto per i siti che hanno un traffico elevato e un volume di ordini elevato, o anche siti che hanno un catalogo di prodotti molto ampio.

Avendo questi tre diversi tipi di tabelle, nuove tabelle principali per le informazioni sull'ordine principale, nuove tabelle plug-in per i dati plug-in in particolare e nuove meta tabelle per qualsiasi tipo di metadati personalizzati che uno sviluppatore deve archiviare, ciò alleggerirà il collo di bottiglia che la tabella post meta in precedenza e attualmente ha per le interazioni dei tuoi ordini. Ci saranno anche indici dedicati per queste tabelle, che aiuteranno la velocità di recupero di quelle entità specifiche in ognuna di quelle tabelle. E sentirai di più sulla tabella degli ordini personalizzati più avanti in DE{CODE}.

Quindi diamo un'occhiata al terzo miglioramento, la velocità di headless. Quindi questo suggerimento è di andare senza testa perché senza testa, la pila senza testa, aumenta la velocità di ordini di grandezza. Il codice JavaScript nel front-end della tua infrastruttura headless sarà molto più veloce e, in alcuni casi, 10 volte più veloce della tradizionale infrastruttura WordPress. Abbiamo persino clienti sulla nostra infrastruttura Atlas che registrano aumenti di sei volte in tutte le metriche Lighthouse.

E in WP Engine, abbiamo un'infrastruttura headless chiamata Atlas. Questa infrastruttura lo consente: ha anche un componente chiamato il nostro motore di contenuti, che aumenta notevolmente la velocità di recupero di tutti i tipi di contenuto statico e dinamico attraverso la tua istanza WooCommerce. Le infrastrutture senza testa ti consentono inoltre di personalizzare le integrazioni back-end e creano opportunità per ottimizzazioni fulminee con quelle applicazioni di terze parti con cui il tuo sito WooCommerce deve integrarsi. E questo è il mio ultimo consiglio per oggi.