WooCommerce hurts mobile speed – here’s 9 unusual tips to fix it.

WordPress Mobile Speed

Updated: May 2019


There are no affiliate links on PagePipe.

Site speed is part of the body language of your site. Slow sites come across as poor quality. Most of your potential clients have no patience for slow-loading pages.

At PagePipe, our design process focuses on page speed. Our technical expertise sets us apart from web designers focusing only on “the look.”

Mobile-first WooCommerce needs speed.

WooCommerce powers 22 percent of the top e-stores in the world. It’s the most popular shopping cart software – and if you have a smaller or mid-sized website, and you want to make it faster, better, and more attractive, WooCommerce is best.

Speed up WooCommerce and reduce cart abandonment.

47 percent of consumers expect a web page to load in 2 seconds or less. An additional delay of one-second results in a 7 percent reduction in conversions.

Your host server is the most important thing for speeding up WooCommerce. But there are other speed tricks that help compensate for shared-hosting slowness. Yes. You can use WooCommerce on cheap hosting – and still, be fast. But it takes special handling.

Can your WooCommerce website convert first-time visitors? Why are first-visit conversions key? Because: 84 percent of website conversions occur on the first visit.

Smartphones convert at one-third to one-quarter of the rate of traditional desktop or tablet devices. … Roughly 44 percent of mobile users expect a site to load as fast as a desktop experience or faster. – source

Your website’s first impression makes you or breaks you.

The first impression is the only impression that matters. Think about how speed affects your visitor’s impression.

WooCommerce is a clunky plugin. It’s one of the slower loading plugins we’ve tested. It was designed under duress because of fast growth and constant change. That causes plugin code ballooning.

WooCommerce plugin became even more bloated after WordPress acquired the plugin. Adding plugin security features slowed it down, especially adding the password strength meter. Corporate lawyers saw it as a legal risk and liability more than an asset. Make it safe! But at what cost? Keep reading more below.

PagePipe does not have any affiliation to WooCommerce plugin or WordPress.com.
There are no affiliate links in this article.

Four benefits of speeding up WooCommerce:

  • Improve visitor’s online shopping transactions.

  • Speed up WooCommerce for better UX.

  • Enhance your mobile branding.

  • Reduce customer shopping cart abandonment.

In May 2015,  Automattic (WordPress’ parent company) acquired WooThemes and WooCommerce. WordPress chose to buy instead of building its own in-house commerce platform. This was an estimated $30 million-plus buyout. The plugin competes with the likes of Shopify and Bigcommerce. WooCommerce plugin’s free version has more than 4 million installations.

Publishing products and selling them on the web is more complex than simple publishing. Especially when you factor in location, tax, payment gateways, and processing transactions. The average non-developer has little concept of what it takes to set up a blog, let alone an online store.

9 Tips and Tests for
Speeding up WooCommerce websites:

1Remove global 500ms SSL-bloat.

Online payment systems such as PayPal requires SSL/HTTPS hosting to work. That slows down your site on every page and post. It’s not cache-able overhead. SSL is not about compliance with Google mandates, security, customer trust, or SEO fiddling. It’s necessary to get paid and deliver products. SSL is the equivalent of adding 500 discrete free plugins to your site. Think about that.

Our goal is achieving Google’s browser security shield on WooCommerce transaction pages only. Then all remaining pages and posts will load 400 to 500 milliseconds faster. This is most important for mobile e-commerce user experience. We aren’t concerned about hardening security.

SSL mythology created a faddish consumer and site owner panic. SSL is false safety. There are SSL workarounds for nefarious purposes by hackers. There’s no stopping a determined and deliberate hacker attack. Minimal SSL compliance is a marketing communication strategy.

Using the pricey $60+ pluginReally Simple SSL on specific pages” is one method to selectively disable SSL handshaking delays. We don’t recommend paid plugins except when desperate. You only need SSL on pages with WooCommerce functions.

Our favorite alternative is splitting the site. Our main domain is running with no SSL/HTTPS site drag. The store is on a different domain with free SSL/HTTPS activated. This is most beneficial if you’re doing content marketing. Keep those entry pages fast! Once visitors engage with fast-loading posts, they tolerate slower loads on store pages.

REFERENCE: http://pagepipe.com/httpsssl-and-its-negative-impact-on-mobile-speed/

REFERENCE: http://pagepipe.com/reduce-ssl-speed-for-easy-digital-downloads-plugin-and-paypal-transactions/


2No selective deactivation possible.

The White Screen of Death (WSoD) or simply “White Death” refers to an error or issue with an operating system that causes the computer or device to stop working and display only a white screen.

WooCommerce plugin cannot be selectively deactivated. That will white screen the site. Selective deactivation of plugins is a beautiful speed strategy. We can’t use it with this plugin. Sadness.

Nor can any associated WooCommerce add-on plugin be selectively deactivated. It will break all e-commerce pages. For example, these plugins will break the shopping cart if any of them is deactivated anywhere:

  • Woo Discount Rules

  • Aero: Custom WooCommerce Checkout Pages

  • WooCommerce Square

  • WooCommerce – ShipStation Integration

REFERENCE: http://pagepipe.com/selective-plugin-deactivation/

The WC Speed Drain Repair plugin successfully dequeues 4 requests. But the measurable speed difference is negligible. In theory, it speeds up all other site pages that are NOT Woo related.

https://wordpress.org/plugins/wc-speed-drain-repair/


3Disabling AJAX cart fragments for speed.

AJAX JavaScript requests delay pages by 500 to 1000 milliseconds on all pages and posts. That’s a long wait. This is because it is not localized loading from your server. Ajax is called from a remote server. Normally, Ajax requests are made many times on an e-commerce page as the cart is updated or verified by repeated code interrogation. A watchdog for changes causes delays.

Ajax coded poorly can be worse than not using Ajax at all. We think WooCommerce needs to be modified to get rid of this inherent speed problem. So how do you do fix that? Keep reading.

The Disable Cart Fragments plugin is helpful to deactivate global Ajax loading. Selectively activate it on cart and checkout pages and any other WooCommerce-related pages. This requires expert usage of Plugin Logic plugin. This technique completely disables the AJAX cart fragments feature in WooCommerce. This boosts loading speed (redirect to cart page recommended). Plugin Logic is our secret speed enhancer.

The Disable Cart Fragments by Littlebizzy plugin closed in December 2018. It’s no longer available for download from the WordPress plugin directory. Reason: Author Request.

Why would the author remove a plugin from the directory? Our guess is it required too much service time. Yep. Pain in the butt to maintain and service. It needed explaining how selective activation worked. Most site owners couldn’t figure it out. The plugin then became a liability to the author. It was consuming his time with no payback. It’s a plugin tool for experts. In the hands of a novice, it’s a site killer. You can’t activate this plugin and walk away. It requires thinking.

Plugin still available at:
Disable-cart-fragments
14k download zip file

We’re supplying the “black market.” Use the plugin at your own risk. We use this plugin all the time. But if you don’t understand the plugin – or selective activation, avoid it.

AJAX cart fragments update shopping cart totals without refreshing the whole page.

This non-feature slows down WooCommerce stores. You can remove the feature with Disable Cart Fragments plugin. Remember to enable the “redirect to cart” option in WooCommerce settings.

The admin-ajax loading improved with recent versions of WooCommerce. Still ?wc-ajax=get_refreshed_fragments AJAX causes delays on most sites. Disabling shopping cart queries (i.e. # items in cart) helps.

ALERT: If you use this plugin, disable it on special WooCommerce pages or make sure you enable the “redirect to cart” option in WooCommerce’s settings. Then when a customer adds a product to their cart, they’re redirected to the cart page. Otherwise, they may get confused about why their chosen product isn’t added to the cart.


4Change WooCommerce minimum password strength for creating a user account.

We disable WooCommerce’s “password strength” settings for 2 reasons:

1. UX: User frustration increases Woo cart abandonment. The annoyance of creating secure-enough passwords is too difficult.

2. PERFORMANCE: Password-strength-meter adds 803k page weight and 776 milliseconds to page load time. That’s 3/4 of a second. Terrible.

WooCommerce added the “password strength meter” using Javascript. It adds almost 800k of page weight to the cart and checkout pages. While this is atrocious for mobile data, the worst part is that store owners saw increased abandonment of carts at checkout. People got frustrated trying to invent strong enough passwords. Bad user experience. Fewer sales.

Independent plugins were then created to dumb down the “password strength.” But nothing to remove or dequeue the Javascript completely. There is a way to remove it using a functions.php edit. The best way to add this code is with:

★★★★★
Code Snippets
Active installs: 100,000+
Zip file size: 467k

Code Snippets is a way to run small pieces of PHP code on your site. It removes the need to add custom snippets to your theme’s functions.php file.

The snippets are kept in the plugin database. Thus independent of the theme and unaffected by WordPress upgrades.

THIS CODE DEFEATS WOOCOMMERCE PASSWORD STRENGTH METER:

<?php
// Add this PHP snippet to your themes functions.php
function wc_ninja_remove_password_strength() {
if ( wp_script_is( 'wc-password-strength-meter', 'enqueued' ) ) {
wp_dequeue_script( 'wc-password-strength-meter' );
}
}

add_action( 'wp_print_scripts', 'wc_ninja_remove_password_strength', 100 );

add_filter('woocommerce_ajax_get_endpoint', 'rsssl_redirect_ajax');

function rsssl_redirect_ajax($url){

$url = str_replace( 'http://', 'https://', $url );

return $url;
}
Code Snippets plugin dashboard example.

Disable strong passwords at your own discretion.

ALTERNATIVE WIMPIER PLUGINS

wc-password-strength-settings

password-strength-for-woocommerce

Password strength a nightmare.

“I started receiving emails from “would be” customers saying they could not register using WooCommerce on my site.


On inspection, the password strength meter required people to create complex passwords. But it wasn’t giving users the details on what the requirements were:  1 uppercase, 1 lower case, 1 special character, etc. The passwords needed to be well over 10 characters.


New customers got frustrated and gave up trying to check out. I understand security is important – but the password strength is just ridiculous and drives customers a way.” – Testimonial

5Should I disable Auto Embed Script for WordPress if I’m using WooCommerce?

You shouldn’t disable it. We usually kill WordPress oEmbed on many sites. But with WooCommerce, it’s a detriment. Not worth the grief.

REFERENCE: http://pagepipe.com/oembed-removal-for-mobile-wordpress-speed-fanatics/


6Caching problems to avoid.

Make sure you exclude these pages from the cache:

  • Cart

  • My Account

  • Checkout

These pages should remain dynamic. They display information specific to the current customer. Keep these pages as light as possible by avoiding unnecessary web assets.

Use selective plugin activation. Disable your caching plugin on the cart, my account, and checkout pages.


7Trust badges increase cart conversion rate.

Trust symbols matter.

Customers abandon your site during checkout if they don’t feel the information is secure. It’s easy to put them at ease by adding a few trust symbols throughout your site. This includes:

  • Clear contact information (phone and email) in the header and footer.

  • Extended contact information like a physical address on a “contact us” page.

  • SSL/security certificate badges.

  • Secure checkout badges, like PayPal and Authorize.net. These won’t slow down you site if you optimize them properly.

  • Authentic testimonials.

  • Logos for vendor partners and affiliates.

So what do trust symbols have to do with speed? Optimize those images. Keep them light. Use 8-bit PNG format whenever possible. Keep them small in dimensions and weight. Don’t use interactive badges with third-party counters. Don’t activate Font Awesome if you can avoid it.

REFERENCE: http://pagepipe.com/should-i-disable-font-awesome-and-google-fonts-for-improved-speed/


8Improve your Call to Action.

Make sure any “add to cart” or other call-to-action button is prominent. It should stand out from the page. Use a color scheme different from the content around it to create a strong contrast. We suggest a complementary color. This creates high perceived contrast to your most dominant theme color.

Use action verbs focusing on the user taking action.

For speed: Try to not use plugins that create buttons with shortcodes. Either make 8-bit PNG image buttons or other coding methods. This avoids extra page weight and requests.

OFFSITE REFERENCES:


9Relevant custom product photography.

For speed: Make photographs compressed JPEG images. Not PNG.

  • Avoid rotating header carousels. Time and time again, studies show that rotating carousels — especially self-launching ones — are conversion killers.

  • Display images consistently. While images themselves can be creative, displaying them consistently makes web pages predictable and therefore comfortable to users. The top of the page and the top right area of the page are always good spots for images.

REFERENCE: http://pagepipe.com/what-slider-is-the-fastest-loading/

REFERENCE: http://pagepipe.com/how-to-optimize-images-for-mobile-speed-with-imsanity-plugin/

Lazy load videos for 500 milliseconds per video improvement on a page.

Compress video with online or offline MP4 compressors.  Host your video on YouTube and use a lazy load plugin for speed.

REFERENCE: http://pagepipe.com/lazy-loading-and-infinite-scrolling-for-faster-loading-pages/

 

Make WooCommerce a speed demon.
PagePipe sells speed optimization services.

LEARN MORE

Godspeed—

Steve Teare
performance engineer

Mobile WordPress Speed – without coding!

Coming Soon to PagePipe readers.

Other Related Resources

If you’re new here, start with our best primer speed articles.

If you’re ready to give your WordPress site wings, here are powerful tools to speed up your site.

Learn how the most popular plugins and ideas waste your time – and hurt web speed. Includes important tips for mobile speed without coding.

Build with Empathy
GIVE SPEED