TechBlogSD - Tutto per WordPress e sviluppo WEB
Istruzioni WEB e WordPress, notizie, recensioni di temi e plugin

Correggi il caricamento lento della pagina con WooCommerce wc-ajax=get_refreshed_fragments

351

WooCommerce è uno dei plugin popolari per trasformare il tuo sito WordPress in un negozio online. La maggior parte dei temi popolari offre funzionalità di negozio integrate con l’aiuto del plug-in WooCommerce. Usiamo anche WooCommerce su alcuni dei nostri siti. Di recente, quando abbiamo eseguito un controllo della velocità della pagina su GTmetrix e pingdom, abbiamo scoperto che il caricamento del componente "wc-ajax=get_refreshed_fragments" impiegava circa un secondo. Dopo l’analisi abbiamo scoperto che nella maggior parte degli altri casi ci vogliono anche da 5 a 10 secondi per la pagina da caricare Se hai problemi di velocità della pagina con le chiamate WooCommerce Ajax, ecco le soluzioni per risolvere il problema per diversi scenari.

Risolvi il problema con WooCommerce AJAX

Abbiamo trattato i seguenti argomenti su WooCommerce wc-ajax=get_refreshed_fragments in questo articolo:

  1. Che cos’è wc-ajax=get_refreshed_fragments?
  2. Problema di caricamento della pagina con le chiamate Ajax dell’amministratore
  3. Come risolvere il caricamento lento della pagina in WooCommerce con l’amministratore Ajax?
    1. Disabilita solo la frammentazione del carrello sulla prima pagina del tuo sito
    2. Disattiva solo la frammentazione del carrello in prima pagina e post
    3. Disabilita tutti gli stili e gli script di WooCommerce su tutte le pagine eccetto le pagine del negozio
  4. Utilizzo del plug-in per interrompere la chiamata Ajax dell’amministratore di WooCommerce
  5. Test della velocità della pagina
  6. Arresto dell’API heartbeat di WordPress

1 Che cos’è wc-ajax=get_refreshed_fragments?

Ci è voluto un po’ di tempo per capire che i frammenti aggiornati nel grafico della velocità della pagina vengono richiamati dal plug-in WooCommerce. Poiché il nostro sito è stato ospitato su SiteGround Cloud VPS, l’impatto è stato inferiore e la chiamata WooCommerce Ajax impiegava circa un secondo. Se stai ospitando su un hosting condiviso come Bluehost, potresti notare un ritardo più lungo nel caricamento della pagina da 3 a 10 secondi.

Di seguito è riportato lo screenshot di pingdom che mostra il lungo tempo di attesa per il caricamento di "wc-ajax=get_refreshed_fragments" sulla pagina. Puoi anche vedere che questo script sarà elencato sotto un problema di blocco del rendering nello strumento Google PageSpeed ​​Insights e trovarlo sotto il grafico a cascata in GTmetrix.

Problema di caricamento della pagina Ajax di WooCommerce

Fondamentalmente WooCommerce tenta di raccogliere i dettagli del carrello chiamando lo script e impiega molto tempo per completare l’attività. Il plugin ottiene i dettagli del carrello non memorizzati nella cache su ogni pagina per mostrare gli ultimi articoli del carrello chiamando l’amministratore Ajax. Puoi vedere lo script come di seguito su ogni pagina del tuo sito:

<script type='text/javascript'> /* <![CDATA[ */ var wc_add_to_cart_params = {"ajax_url":"/wp-admin/admin-ajax.php","wc_ajax_url":"/?wc-ajax=%%endpoint%%","i18n_view_cart":"View Cart","cart_url":"http://localhost/shop/cart/","is_cart":"","cart_redirect_after_add":"yes"}; /* ]]> */ </script>

Questo è nell’ambiente localhost e dovresti vedere il codice con il tuo URL.

Correggi il caricamento lento della pagina con WooCommerce wc-ajax=get_refreshed_fragments

Frammenti Ajax di WooCommerce sull’origine della pagina

2 chiamate Admin Ajax e caricamento della pagina

WooCommerce utilizza questa chiamata Ajax dell’amministratore di frammentazione del carrello per aggiornare gli articoli e il totale nel carrello senza aggiornare la pagina. Chiamare l’amministratore Ajax su ogni pagina ritarderà notevolmente il tempo di caricamento della pagina e consumerà anche elevate risorse del server. L’altro problema è che il plug-in esegue questa azione anche su una pagina in cui non sono presenti carrelli della spesa o dettagli relativi al prodotto.

Lo screenshot sopra mostra che il problema esiste nella pagina "Chi siamo" in cui non sono disponibili componenti WooCommerce. Quindi, rimuovere il carrello dalla pagina non aiuterà a migliorare la velocità di caricamento della pagina. Ciò di cui abbiamo bisogno è disabilitare l’aggiornamento del carrello dove non ci sono carrelli della spesa o prodotti visualizzati.


Articolo WooCommerce correlato:

3 Come risolvere il problema con wc-ajax=get_refreshed_fragments?

Il problema deve essere risolto rimuovendo la coda dallo script modificando il file functions.php del tuo tema. Puoi modificare functions.php tramite il pannello di amministrazione di WordPress o utilizzando FTP. Invece di modificare il file functions.php, crea un tema figlio e aggiungi funzioni aggiuntive nel tema figlio. Questo ti aiuterà a mantenere le modifiche quando aggiorni il tema. Esistono tre opzioni per rimuovere dalla coda lo script di frammentazione del carrello Ajax di WooCommerce.

  • Disabilita solo la frammentazione del carrello sulla prima pagina del tuo sito
  • Disattiva solo la frammentazione del carrello in prima pagina e post
  • Disabilita tutti gli stili e gli script di WooCommerce su tutte le pagine eccetto le pagine del negozio.

Cerchiamo di discutere tutte e tre le opzioni in dettaglio, fare solo una cosa richiesta per te.

3.1. Disabilita la frammentazione del carrello in prima pagina

Nel pannello di amministrazione di WordPress, vai su "Aspetto> Editor" e individua il file functions.php. Aggiungi il seguente codice alla fine del file.

/** Disable Ajax Call from WooCommerce */ add_action( 'wp_enqueue_scripts', 'dequeue_woocommerce_cart_fragments', 11); function dequeue_woocommerce_cart_fragments() { if (is_front_page()) wp_dequeue_script('wc-cart-fragments'); }

Dovrebbe apparire come sotto nell’editor, una volta incollato il codice fai clic su "Aggiorna file" per salvare le modifiche.

Correggi il caricamento lento della pagina con WooCommerce wc-ajax=get_refreshed_fragments

Modifica delle funzioni del tema File PHP

Se desideri utilizzare FTP, accedi al tuo server utilizzando l’account FTP. Vai su "/wp-content/your-theme/" e trova il file "functions.php". Modifica e aggiungi il codice sopra alla fine del file e carica di nuovo il file modificato sul server.

Una volta aggiornato il file, vai al menu "WooCommerce > Impostazioni" e vai alla sezione "Display" nella scheda "Prodotti". Abilita la casella di controllo accanto all’opzione "Reindirizza alla pagina del carrello dopo l’aggiunta riuscita".

Correggi il caricamento lento della pagina con WooCommerce wc-ajax=get_refreshed_fragments

Abilita il reindirizzamento alla pagina del carrello

Questo aiuterà il cliente ad andare alla pagina principale del carrello invece di aspettare molto tempo dopo che l’articolo è stato aggiunto al carrello. In caso contrario, anche se l’articolo viene aggiunto, il tuo carrello potrebbe non mostrare i dettagli aggiornati quando ti trovi nella stessa pagina poiché lo script di frammentazione del carrello è disabilitato.

3.2. Disabilita la frammentazione del carrello in prima pagina e post

Il codice sopra disattiverà lo script del frammento del carrello solo sulla prima pagina statica. Se vuoi disabilitare lo script su tutti i post, prova ad aggiungere il codice seguente nel file function.php del tuo tema.

/** Disable Ajax Call from WooCommerce on front page and posts*/ add_action( 'wp_enqueue_scripts', 'dequeue_woocommerce_cart_fragments', 11); function dequeue_woocommerce_cart_fragments() { if (is_front_page() || is_single()) wp_dequeue_script('wc-cart-fragments'); }

3.3. Disabilitare tutti gli stili e gli script di WooCommerce a livello di sito

WooCommerce è un plug-in ad alta intensità di risorse che potrebbe richiedere le risorse del tuo server per caricare tutti i fogli di stile e gli script pertinenti. Se disponi di pochi prodotti con centinaia di migliaia di post di blog, allora ha senso rimuovere dalla coda o disabilitare tutti gli elementi rilevanti di WooCommerce sui post del blog. In altre parole, puoi consentire solo gli script WooCommerce sulle pagine pertinenti del negozio in modo che tutte le altre pagine vengano caricate più velocemente.

Aggiungi il codice seguente nel tuo file functions.php basato sull’essenza di Github. Il codice controllerà prima se il plug-in WooCommerce esiste sul tuo sito e quindi disabiliterà gli stili e gli script su tutte le pagine eccetto le pagine del prodotto, del carrello e del checkout. Questo aiuterà a rimuovere le chiamate "wc-ajax=get_refreshed_fragments" da tutti i post/pagine eccetto le pagine relative a WooCommerce.

/** Disable All WooCommerce Styles and Scripts Except Shop Pages*/ add_action( 'wp_enqueue_scripts', 'dequeue_woocommerce_styles_scripts', 99 ); function dequeue_woocommerce_styles_scripts() { if (function_exists( 'is_woocommerce')) { if (! is_woocommerce() &&! is_cart() &&! is_checkout()) { # Styles wp_dequeue_style( 'woocommerce-general' ); wp_dequeue_style( 'woocommerce-layout' ); wp_dequeue_style( 'woocommerce-smallscreen' ); wp_dequeue_style( 'woocommerce_frontend_styles' ); wp_dequeue_style( 'woocommerce_fancybox_styles' ); wp_dequeue_style( 'woocommerce_chosen_styles' ); wp_dequeue_style( 'woocommerce_prettyPhoto_css' ); # Scripts wp_dequeue_script( 'wc_price_slider' ); wp_dequeue_script( 'wc-single-product' ); wp_dequeue_script( 'wc-add-to-cart' ); wp_dequeue_script( 'wc-cart-fragments' ); wp_dequeue_script( 'wc-checkout' ); wp_dequeue_script( 'wc-add-to-cart-variation' ); wp_dequeue_script( 'wc-single-product' ); wp_dequeue_script( 'wc-cart' ); wp_dequeue_script( 'wc-chosen' ); wp_dequeue_script( 'woocommerce' ); wp_dequeue_script( 'prettyPhoto' ); wp_dequeue_script( 'prettyPhoto-init' ); wp_dequeue_script( 'jquery-blockui' ); wp_dequeue_script( 'jquery-placeholder' ); wp_dequeue_script( 'fancybox' ); wp_dequeue_script( 'jqueryui' ); } } }

Avvertenza: ricorda di aggiungere solo uno dei blocchi di codice delle tre opzioni precedenti. Non aggiungere più o tutti i codici nel file functions.php. Quando disabiliti gli script lateralmente, disabilita anche l’opzione "Abilita Ajax aggiungi al carrello sugli archivi" disponibile nella sezione "Visualizza" del menu "WooCommerce > Impostazioni".

4 Utilizzo dei plugin per interrompere le chiamate Ajax dell’amministratore di WooCommerce

Se non hai familiarità con la modifica del file del tema o la creazione di un tema figlio, allora ci sono plugin che fanno il lavoro per te. La prima opzione è utilizzare il plug-in WP Rocket premium. Puoi acquistare WP Rocket, installare e attivare il plugin dal tuo pannello di amministrazione di WordPress. Questo plugin non ha impostazioni speciali per WooCommerce. La semplice attivazione del plugin disabiliterà la frammentazione del carrello WooCommerce su tutte le pagine del tuo sito. Funziona con la logica di verificare se la tua pagina contiene una chiamata di frammenti Ajax nel codice sorgente.

Se sì, controllerà che il carrello sia vuoto durante il caricamento della pagina. Quando entrambe queste condizioni sono soddisfatte, WP Rocket memorizzerà nella cache la pagina in modo transitorio e verrà pubblicata quando la pagina verrà caricata la volta successiva. Se riscontri problemi, puoi utilizzare il plugin di supporto per disattivare la memorizzazione nella cache dei frammenti Ajax.

Plugin come W3 Total Cache offre anche la cache dei frammenti come estensione premium. Tuttavia, è necessario pagare un abbonamento annuale di $ 99 per ottenere funzionalità premium. Invece, WP Rocket costa $ 49 all’anno con una facile configurazione e puoi anche ottenere uno sconto del 10% iscrivendoti alla loro newsletter.

5 Test della velocità della pagina

Se hai aggiunto manualmente il codice, assicurati di eliminare la cache del tuo plug-in di memorizzazione nella cache ed eliminare la cache di vernice sul server, se disponibile. Allo stesso modo, cancella tutti i livelli di memorizzazione nella cache se hai installato il plug-in WP Rocket. Successivamente, controlla su Google PageSpeed ​​Insights e non dovresti vedere lo script "wc-ajax=get_refreshed_fragments" nella sezione JavaScript di blocco del rendering. Puoi anche ottenere facilmente 100 punti su dispositivi mobili e desktop quando il tempo di blocco è 0 ms.

Correggi il caricamento lento della pagina con WooCommerce wc-ajax=get_refreshed_fragments

Disabilita stili e script di WooCommerce

Anche su pingdom, lo script WooCommerce che chiama "wc-ajax=get_refreshed_fragments" non dovrebbe essere visibile nella sezione "Richieste file". Il tuo punteggio di velocità della pagina dovrebbe essere aumentato notevolmente dopo aver disabilitato lo script Ajax di WooCommerce.

6 Arresto dell’API Heartbeat di WordPress

Il plug-in WooCommerce aggiunge molti interessanti widget di dashboard che mostrano vendite e statistiche in tempo reale. Tuttavia, ciò ti costerà molto trascinando la velocità di caricamento del tuo sito. I widget della dashboard aggiornano il contenuto in modo dinamico utilizzando le chiamate admin Ajax in modo simile alla frammentazione del carrello in WooCommerce. Questo viene fatto con l’aiuto dell’API standard di WordPress chiamata API heartbeat.

Generalmente non consigliamo di avere quei widget dinamici sulla dashboard. Puoi semplicemente disabilitare le chiamate admin-ajax o l’API heartbeat di WordPress per ridurre il carico del server e migliorare la velocità di caricamento della pagina del tuo sito WordPress. Plugin come WP Rocket possono aiutare a disabilitare l’API heartbeat dal pannello di amministrazione.

Parole finali

WooCommerce è uno dei modi più semplici per creare il tuo negozio online in WordPress. Ma i negozi online necessitano di alcune funzioni di base come l’aggiornamento dinamico del carrello. Nella nostra esperienza, quello che abbiamo visto è che il 90% degli utenti di WooCommerce vende semplici beni digitali. Il loro negozio è semplicemente un’aggiunta al grande blog o al sito di contenuti. In questo caso, consigliamo vivamente di disabilitare le chiamate Ajax dell’amministratore in modo che tutte le altre pagine del sito si carichino più velocemente senza influire sull’esperienza dell’utente.

Se hai un negozio a tutti gli effetti, avrai bisogno della funzione di frammentazione del carrello per aggiornare dinamicamente gli articoli del carrello senza aggiornare la pagina. In tal caso, assicurati di avere un server di hosting di qualità insieme a plug-in di memorizzazione nella cache come WP Rocket o W3 Total Cache che ha un’opzione premium per la memorizzazione nella cache di frammenti di pagina per migliorare la velocità della pagina.

Fonte di registrazione: www.webnots.com
Lascia una risposta

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More