A popular tool for adding shopping carts to WordPress websites is a feature in WooCommerce called AJAX Cart Fragments. This feature updates parts of a web page without reloading the entire page like shopping cart totals. This is great for quickly reflecting changes, but it can sometimes slow down your website, especially if it’s not updating quickly or if there’s a lot of admin activity going on.
Tools like Pingdom and GTMetrics often report that these cart fragments can slow down your website because they make a lot of AJAX requests that the server can’t cache. This heavy load can cause slow performance.
What are WooCommerce Fragments?
WooCommerce Fragments are parts of WooCommerce that use AJAX technology to smoothly and quickly update web pages without reloading the entire page. AJAX allows the website to silently talk to the server in the background, so only the parts of the page that need to be updated will change.
In WooCommerce, these fragments are small pieces of the webpage, such as shopping carts or prices, that can be updated automatically. This is really helpful for online stores as it allows buyers to see immediate changes, making their shopping experience better and more intuitive.
What are WooCommerce Cart Fragments?
WooCommerce Cart Fragment is a useful feature that updates parts of a website’s shopping cart without reloading the entire page. This feature provides instant updates when users add or remove items from their cart, making the shopping experience easier and more engaging. Updates occur through a process called AJAX, where a request is sent to the server when a user makes a change, and then the server sends back new information, such as the updated total and item count.
Although this feature is great for improving the shopping experience, it can sometimes slow down the website. To avoid this, developers can turn off this feature on certain pages where immediate updates are not necessary. They can also customize how it works to ensure that only essential parts of the page are updated, helping the website run more efficiently.
By smartly managing these WooCommerce cart pieces, developers can make online stores faster and more responsive, which can help increase sales and keep customers happy.
About WooCommerce Cart Fragments
WooCommerce’s “Cart Fragments” feature uses a script to update the shopping cart on a webpage without reloading the entire page. However, this can slow down your website and cause problems with the way pages are saved in the cache, especially on pages that don’t require shopping cart information.
For example, this feature may affect pages such as blog posts, informational pages, and feeds that do not involve purchases, making it slower and harder for the server to handle these pages efficiently.
To check whether the cart section is used on your website, you can run a speed test or view the access logs of your website. All you need to do is add this to your website address:
http://testsite.codexcoach.com/?wc-ajax=get_refreshed_fragments
Here’s what you might see in the Access Log if Cart Fragments are active:
- Date and time: 31/Dec/2017:23:59:59 +0000
- Server response code: 200
- Connection duration: 0.328 seconds
- Processing time: 0.330 seconds
- Request type: POST /?wc-ajax=get_refreshed_fragments HTTP/2.0
This entry shows that the cart update script was run at the specified time and date.
How to Disable Ajax Cart Fragments in WooCommerce?
To turn off the WooCommerce Ajax Cart Fragments script, you first need to understand a bit about how WooCommerce uses this script. Essentially, it’s a JavaScript file that helps update your cart without needing to reload the page. It relies on JQuery and cookies to work properly. Here’s how WooCommerce sets up this script in its code:
'wc-cart-fragments' => array(
'src' => self::get_asset_url( 'assets/js/frontend/cart-fragments' . $suffix . '.js' ),
'deps' => array( 'jquery', 'js-cookie' ),
'version' => WC_VERSION,
),This script is added to your website’s pages using the following command:
self::enqueue_script( 'wc-cart-fragments' );When we examine the “enqueue_script()” function, we learn that the “wc-cart-fragments” script is first set up (or registered) and then added to the list of scripts to be run on the website, as described in the WordPress guidelines. This process ensures that the script is properly prepared and then activated to function on your site.
(https://developer.wordpress.org/reference/functions/wp_enqueue_script):
private static function enqueue_script( $handle, $path = '', $deps = array( 'jquery' ), $version = WC_VERSION, $in_footer = true ) {
if ( ! in_array( $handle, self::$scripts, true ) && $path ) {
self::register_script( $handle, $path, $deps, $version, $in_footer );
}
wp_enqueue_script( $handle );
}If a script is “enqueued” (added to the list of scripts to be run), it can also be “dequeued” (removed from that list), similar to how you can add or remove actions in PHP with the add_action() and remove_action() functions.
If a script is added (enqueued), it can also be removed (dequeued). You need to remove it after it has been added, usually by setting a slightly higher priority in your code, like 11 instead of the default 10.
Here’s a simple way to do it:
/**
* @snippet Disable WooCommerce Ajax Cart Fragments Everywhere
* @author Akash Soni
* @compatible WooCommerce 3.6.4
* @community https://codexcoach.com/
*/
add_action( 'wp_enqueue_scripts', 'codexcoach_disable_woocommerce_cart_fragments', 11 );
function codexcoach_disable_woocommerce_cart_fragments() {
wp_dequeue_script( 'wc-cart-fragments' );
}This code stops the cart fragments script from loading, which might make your website faster. However, if you have a shopping cart icon in your website’s header that shows a dropdown cart, this dropdown will stop working. The cart will still show how many items are in it and the total cost, but it won’t show the dropdown details on hover.
If you only want to stop this script on your homepage and keep it on other pages, use this code:
/**
* @snippet Disable WooCommerce Ajax Cart Fragments On Static Homepage
* @author Akash Soni
* @compatible WooCommerce 3.6.4
* @community https://codexcoach.com/
*/
add_action( 'wp_enqueue_scripts', 'codexcoach_disable_woocommerce_cart_fragments', 11 );
function codexcoach_disable_woocommerce_cart_fragments() {
if ( is_front_page() ) wp_dequeue_script( 'wc-cart-fragments' );
}This way, you can optimize the script’s usage based on your needs, potentially speeding up your homepage while retaining full functionality on other pages.
You may also like:- How to Get WooCommerce Order Details From $order Object
