The Commerce Performance Dilemma
Speed is direct revenue in e-commerce. A 100-millisecond delay in load time can hurt conversion rates by up to 7%. Yet standard WooCommerce stores frequently suffer from script bloat, unoptimized product archives, and layout shifts caused by external tracking scripts.
When engineering high-volume stores like Kursi Nepal and Annapurna Foods, our target was simple: achieve sub-second initial server response time and maintain a 95+ Google PageSpeed mobile rating across all catalog pages.
1. Eliminating WooCommerce Bloat on Non-Store Pages
By default, WooCommerce enqueues cart fragments, generator tags, and payment gateway scripts on every single page of your site, including pure editorial and landing pages. Deregistering these conditionally provides an immediate performance boost:
<?php
function ferran_conditional_wc_assets() {
if (function_exists('is_woocommerce') && !is_woocommerce() && !is_cart() && !is_checkout()) {
wp_dequeue_style('woocommerce-general');
wp_dequeue_style('woocommerce-layout');
wp_dequeue_style('woocommerce-smallscreen');
wp_dequeue_script('wc-cart-fragments');
}
}
add_action('wp_enqueue_scripts', 'ferran_conditional_wc_assets', 99);
2. Stabilizing Cumulative Layout Shift (CLS)
To eliminate CLS, always define explicit width and height attributes on product card image elements, or use modern CSS aspect-ratio: 4 / 3 wrappers with background placeholder skeletons.
3. Modern Speculative Prerendering
Using the native <script type="speculationrules"> HTML API allows browsers to prefetch category archives conservatively when users hover over product categories, creating instantaneous navigation transitions.
