Knowing how to fix WooCommerce performance issues is key to your online business’ success. The snappier your ecommerce site is to your users, the better their online shopping experience. And the better their user experience, the more likely they are to place an order. All in all, this translates to more sales and profits. Hence, performance is at the core of your Woocommerce store’s success.

According to a study, 46% of users don’t revisit a poorly performing site. Hence, it’s common for ecommerce sites to miss out on potential sales due to performance issues. If you haven’t optimized your site for performance, you can lose even more during high seasonal traffic days such as Black Friday and Cyber Monday.

While you can use many techniques to speed up your ecommerce site, quickly solving a pressing performance issue is challenging. It requires proactive monitoring of the site’s overall environment. That’s where an application performance monitoring tool like Kinsta APM can be super helpful.

In this article, you’ll learn about the various components of an ecommerce site, why you need an APM tool to monitor your ecommerce site’s performance, and how you can use Kinsta APM to stay on top of your WooCommerce site’s performance.

Ready to begin? Let’s go!

The Various Components of an Ecommerce Site

To run an ecommerce site at optimal performance, all the pieces matter. From its hosting infrastructure and ecommerce platform to its third-party integrations and the checkout process, everything counts!

Illustration of a typical WooCommerce store stack

A typical WooCommerce store stack

Whether you’re selling craft beers or drone training courses, an ecommerce platform like WooCommerce makes it a piece of cake to quickly set up and launch an online store.

Its various extensions also make it super simple to extend the store’s functionality with many essential components.

The various components of an ecommerce store

Tracking various ecommerce components is complex

The more links there are in a chain, the harder it is to find the defective joint when an issue arises. All this complexity can lead to increased performance and availability problems. It affects your capability to respond quickly to performance issues and fix them before they impact your customers.

The solution? Using an application performance monitoring tool.

We’ve explicitly designed Kinsta APM to monitor the performance of WordPress sites, including WooCommerce stores hosted at Kinsta.

body a.novashare-ctt{display:block;background:#00abf0;margin:30px auto;padding:20px 20px 20px 15px;color:#fff;text-decoration:none!important;box-shadow:none!important;-webkit-box-shadow:none!important;-moz-box-shadow:none!important;border:none;border-left:5px solid #00abf0}body a.novashare-ctt:hover{color:#fff;border-left:5px solid #008cc4}body a.novashare-ctt:visited{color:#fff}body a.novashare-ctt *{pointer-events:none}body a.novashare-ctt .novashare-ctt-tweet{display:block;font-size:18px;line-height:27px;margin-bottom:10px}body a.novashare-ctt .novashare-ctt-cta-container{display:block;overflow:hidden}body a.novashare-ctt .novashare-ctt-cta{float:right}body a.novashare-ctt.novashare-ctt-cta-left .novashare-ctt-cta{float:left}body a.novashare-ctt .novashare-ctt-cta-text{font-size:16px;line-height:16px;vertical-align:middle}body a.novashare-ctt .novashare-ctt-cta-icon{margin-left:10px;display:inline-block;vertical-align:middle}body a.novashare-ctt .novashare-ctt-cta-icon svg{vertical-align:middle;height:18px}body a.novashare-ctt.novashare-ctt-simple{background:0 0;padding:10px 0 10px 20px;color:inherit}body a.novashare-ctt.novashare-ctt-simple-alt{background:#f9f9f9;padding:20px;color:#404040}body a.novashare-ctt.novashare-ctt-simple-alt:hover,body a.novashare-ctt.novashare-ctt-simple:hover{border-left:5px solid #008cc4}body a.novashare-ctt.novashare-ctt-simple .novashare-ctt-cta,body a.novashare-ctt.novashare-ctt-simple-alt .novashare-ctt-cta{color:#00abf0}body a.novashare-ctt.novashare-ctt-simple-alt:hover .novashare-ctt-cta,body a.novashare-ctt.novashare-ctt-simple:hover .novashare-ctt-cta{color:#008cc4}46% of users won’t revisit a poorly performing site… which is why monitoring your ecommerce site’s performance is essential for your reputation and your revenue. 💰 Learn more about our built-in APM tool right here ⬇Click to Tweet

The Benefits of Using Kinsta APM for WooCommerce Sites

Your WooCommerce site’s performance issues can cause significant damage to your online business in multiple ways. You can use Kinsta APM to prevent or overcome these problems. Some of its many benefits include:

Increases Sales and Revenue

Performance is critical for an ecommerce site’s bottom line. Maintaining a performant site requires an understanding of many metrics and DevOps skills. Kinsta APM makes this task easier for you and your staff. As a result, the impact on sales and revenue is the most significant benefit of using Kinsta APM.

Betters User Experience

It’s challenging to gauge your users’ satisfaction, as they may go away silently when faced with a speed or performance issue. What’s worse is that they may go to your competitor’s site. A useful APM tool like Kinsta APM gives you the performance insights you need to make sure that your customers are happy and satisfied with your WooCommerce store.

Curtails Damage to Brand Reputation

Words travel pretty fast in the digital era. Users no longer wonder whether your ecommerce site performs perfectly. They expect it. So, when they’re interrupted due to site slowdowns or outages, you don’t just lose a sale, but also your brand’s reputation and trust. Kinsta APM can reduce its chances by helping you to keep your site performing at its best.

Increases Productivity and Happiness

A better performing site translates to improved internal staff productivity too. For instance, your development team doesn’t have to spend as much time addressing performance issues. The support staff doesn’t have to manage as many tickets. Your marketing team can get more campaigns done in less time. Everyone is more productive and happy when the site is tuned to perform well.

Frees up Time for Innovation

Experimenting with innovative strategies to drive business growth is one of the cornerstones of ecommerce marketing. Whether you’re a developer or a marketer, Kinsta APM’s simplicity drives collaboration, fostering effective business growth strategies. It also enables faster problem resolution, resulting in the rollout of new features with greater confidence.

Decreases Hosting and IT Infrastructure Costs

By identifying performance bottlenecks that would otherwise go undetected, Kinsta APM helps you squeeze the most out of your hosting infrastructure. It enables you to fine-tune your WooCommerce site to scale your website better. Furthermore, by identifying troublesome plugins, extensions, and third-party services, Kinsta APM sets you on the right path towards cutting non-performing IT assets.

How to Fix WooCommerce Performance Issues with Kinsta APM

It’s now time to check some real-world examples and explore how you can use Kinsta APM to fix WooCommerce performance issues.

Learn the Basics of Kinsta APM

First things, first! Before you dive deep into troubleshooting your WooCommerce site with Kinsta APM, it’s necessary to learn its various terminologies and how you read its insights. You can refer to our Kinsta APM knowledgebase to get started.

If you have more questions about Kinsta APM, I suggest you read the Kinsta APM FAQ section.

The Test WooCommerce Site and Setup

Kinsta APM works only with WordPress sites hosted at Kinsta. For this article, I set up a test WooCommerce site to simulate online stores’ most common performance issues. I used an actual domain name to ensure that an SSL/TSL handshake takes place.

Below are the test site’s details:

  • Server Stack: Nginx 1.19.4, PHP 7.3.24-3, MariaDB 5.5.5
  • WordPress Version: WordPress 5.5.3
  • Theme: Astra Theme 2.6.1
  • Primary Plugins: WooCommerce 4.7.1, WooCommerce Cart Abandonment Recovery, Kinsta Must-use Plugins, and Akismet Anti-spam.

Also, I customized the site slightly using custom plugins to illustrate unique examples. The primary aim here is to teach how you can use Kinsta APM in various situations to troubleshoot several WooCommerce performance issues.

1. WooCommerce APM Example: Sluggish Third-Party API Calls During Checkout

Most ecommerce sites rely on third-party integrations to take care of critical processes such as payments and shipments. Many WooCommerce sites also use third-party plugins like Mailchimp and MailerLite for email marketing.

However, third-party services can have a significant impact on your WooCommerce site’s performance. And if it’s affecting your checkout process, then you should take it even more seriously.

Stripe API down tweets from the Stripe Status account

Stripe’s API faced a major outage last year

In this example, the site took too long to respond whenever a user added a product to their cart. Sometimes, the site took over 5 seconds to respond. That’s a perfect recipe for shopping cart abandonment.

Let’s fire up Kinsta APM to diagnose the problem.

To get started, go to your site’s MyKinsta dashboard, and then head over to the Monitoring section.

Click the Enable button under the Performance monitoring section to let Kinsta APM collect your site’s performance metrics.

WooCommerce APM - MyKinsta

Enabling Kinsta APM in MyKinsta dashboard

If you’d enabled Kinsta APM before (as here), you can see past performance data for that period displayed in the chart and table.

After enabling Kinsta APM, I tested the site and waited for the performance metrics to populate in the Kinsta APM dashboard.

Ideally, wait at least 5 minutes before you dig into the data. It’ll ensure that Kinsta APM has collected enough performance data to present actionable results.

The Kinsta APM main dashboard screen

The Kinsta APM main dashboard screen

Using the dropdown menu to the left of the Enable/Disable button, you can also change the duration Kinsta APM uses to crunch the performance metrics.

Changing the total duration used by Kinsta APM

Changing the total duration used by Kinsta APM

In the Overall transaction time chart, you can see that External calls take up most of the space. It hints that third-party services may be the culprit behind the slowdown.

Next, you can scroll down to the Slowest transactions table to see the requests or background tasks that took the most time to execute.

WooCommerce APM - list of the slowest transactions

A list of the slowest transactions in Kinsta APM

You can see that requests to the /single-product URL took up the most time. On a WooCommerce site, this endpoint refers to any product page.

Click the /single-product transaction to get curated samples of its slowest transactions.

Transaction samples of the slowest transaction

Transaction samples of the slowest transaction

Here, look into the slowest transaction sample as its duration is 5,535.14 ms (or 5+ seconds). It’s way above the expected response time. Let’s click this transaction sample to dig deeper into it.

Transaction sample details in Kinsta APM

Transaction sample details in Kinsta APM

You’ll now see this sample’s Transaction trace timeline. It’ll list time-stamped details of all the processes that occurred in this transaction.

Scroll down through the timeline to find the slowest spans.

Finding the slowest spans in the transaction trace timeline

Finding the slowest spans in the transaction trace timeline

Kinsta APM highlights spans that need your utmost attention with the red color.

Here, the spans are slow.payment-api.com and update_card_payment. Click on both the spans to see a detailed overview of them with a full stack trace and other related information.

‘Span details’ and ‘Stack trace’ in Kinsta APM

‘Span details’ and ‘Stack trace’ in Kinsta APM

By looking at the Span details section, you can infer that it’s an external HTTP request.

Sign Up For the Newsletter

The Stack trace section helps you identify all the processes involved in making this HTTP request. Here, we can see that WC_Form_Handler::add_to_cart_action is engaged. Further up, we see that it also involves a non-core WordPress script called payment-api.php.

Note these down as evidence. However, there’s one more span we have to investigate.

Let’s see the details about it.

‘Span details’ for a PHP script run by a plugin

‘Span details’ for a PHP script run by a plugin

Kinsta APM shines the most here. It digs into all the processes related to this span, and then it gives some context to it. You can see that it’s a PHP script/function named update_card_payment inside the payment-api plugin.

You’ve bagged enough evidence now to make a sound judgment about where to begin your troubleshooting process.

I’d follow this diagnosis by looking into the payment-api plugin, specifically for a PHP script or function called update_card_payment.

If you or your staff don’t have the technical expertise to fix these issues, you can hire a WordPress developer to look into them.

Next, I’d contact the plugin author to look into their payment API, as it’s responding super slow. Kinsta APM can nudge you in the right direction to identify the root cause of a performance issue quickly. What you do with this knowledge is up to you!

Info

In most cases, fixing performance-related issues identified by the Kinsta APM tool falls out of our support scope. If you require additional help with optimizing your WordPress site, we recommend reaching out to one of our partners.

2. WooCommerce APM Example: Slow WooCommerce Admin Dashboard

An online store’s backend performance is just as crucial as its frontend performance. While a slow WooCommerce admin dashboard can negatively impact your productivity, a faster backend can increase your efficiency in managing everyday tasks and how quickly you respond to customer orders.

Having an efficient WooCommerce dashboard also enables you to do more essential things for your online store’s success, like digital marketing.

WooCommerce 4.0 introduced a streamlined dashboard for easy store management

WooCommerce 4.0 introduced a streamlined dashboard

Ideally, backend optimizations start with frontend optimizations, as in most cases speeding up the frontend fixes performance issues on the backend too. With Kinsta APM, you no longer have to rely on guesswork such as this. You’ll get to see the exact performance data for the entire site, helping you fix any performance issue.

In this example, the admin dashboard is sluggish for the admin and store managers. That’s not ideal for taking care of the online store’s daily operations.

Let’s fire up Kinsta APM to see what’s the issue.

After enabling Kinsta APM, I waited over 15 minutes before digging into the performance data. While waiting for that, I went about using the WooCommerce backend as usual.

WooCommerce APM - Fix performance issues with Kinsta APM

Performance metrics in Kinsta APM’s main dashboard screen

The Overall transaction time chart indicates that PHP processes take up the most time, followed by external calls.

Looking at the Slowest transactions table will give us a better idea of which requests are taking up most of the time.

Finding the slowest transactions in Kinsta APM

Finding the slowest transactions in Kinsta APM

From the chart above, it’s clear that two transactions hog most of the time: /wp-admin/admin-ajax.php and /wp-admin.

High Admin-Ajax usage is one of the most common performance issues faced by WordPress site owners. Let’s investigate this transaction further.

Need a hosting solution that gives you a competitive edge? Kinsta’s got you covered with incredible speed, state-of-the-art security, and auto-scaling. Check out our plans

Transaction samples for admin-ajax.php requests

Transaction samples for admin-ajax.php requests

All the admin-ajax.php transaction samples have almost the same duration. A transaction duration of more than 10 seconds is abnormally high.

Let’s check out its slowest sample.

The slowest transaction sample for admin-ajax.php

The slowest transaction sample for the admin-ajax.php request

Scroll down through the Transaction trace timeline to find the spans of interest. In most cases, Kinsta APM will highlight them.

However, that’s not always the case, like in this one:

Finding the slowest spans in the transaction trace timeline

Finding the slowest spans in the transaction trace timeline

You can observe two spans with unusually high duration: snail_admin_refresh PHP process and suspicious-link.com GET external HTTP request.

Examining the slowest span’s details in Kinsta APM

Examining the slowest span’s details in Kinsta APM

Checking the span details will point you towards the plugin running this PHP process. Here, it’s a plugin called snail-admin-refresh-notice. I wrote it to output a hideous notification in the WordPress dashboard, just like some popular WordPress plugins.

Inspecting the stack trace on another slow span

Inspecting the stack trace on another slow span

Looking at the Stack trace of the suspicious-link.com GET span, you can spot that it’s related to the same plugin.

An annoying WordPress notice example

The annoying WordPress admin notice

Here, the cause of the slowdown is literally in the face. However, that’s not always the case. If multiple users are using the WooCommerce dashboard simultaneously, they can tax the server’s resources even more. It may even render the dashboard inaccessible for some users.

By helping you identify the root cause of any performance issue quickly, Kinsta APM enables you to keep your WooCommerce dashboard performing at its best, always!

3. WooCommerce APM Example: Slow Shop and Product Pages

Users can’t wait for slow pages to load, especially when it’s a shop or product page. According to Google’s usability study, users abandon a page when it takes longer than 2.5 seconds to respond.

One of the product pages in the test WooCommerce site

One of the product pages in the test WooCommerce site

There could be many reasons a WooCommerce shop or product page is loading slowly:

  • The shop page may have too many products loading at once.
  • The product page’s size may be large because of unoptimized images, scripts, third-party requests, etc.
  • The shop or product page may load a lot of uncacheable dynamic content on each request’s page.
  • A plugin or the theme may insert custom scripts on every product page to enable extra functionality (e.g. social share counters, related products).

In this example, we’ll be diagnosing slow product pages on our test WooCommerce site. They’re taking an unusually long time to respond, which usually is disastrous for conversion rates.

Let’s enable Kinsta APM and try loading some product pages.

I’ll test them for at least 5 minutes before seeing what’s up with the site’s performance metrics.

Notice the sharp increase in MySQL related transaction time

Notice the sharp increase in MySQL related transaction time

From the Overall transaction time chart, you can observe a drastic uptick in the time taken for MySQL queries. And going by the timestamp, it’s all recent.

Let’s choose a shorter duration to focus on these recent transactions. That’ll rule out all the older performance metrics from our current diagnosis.

WooCommerce APM - Choosing a shorter duration in Kinsta APM

Choosing a shorter duration in Kinsta APM

Now let’s peek into the Slowest transactions table and see which requests take up the most time.

Requests for individual product pages is the slowest

Requests for individual product pages is the slowest

As expected, the /single-product transaction takes up a bulk of the total duration. WooCommerce triggers this request when a user visits any individual product page.

Its maximum duration (136,417.63 ms) is extraordinarily high.

Let’s check it out.

Transaction samples for the individual product page requests

Transaction samples for the individual product page requests

I’ll click on the slowest sample to inspect it. Scrolling through its Transaction trace timeline will give us a better idea of what’s causing this performance issue.

The troublesome span highlighted in bold red

The troublesome span highlighted in bold red

You can see that Kinsta APM has highlighted the taxing span with a bright red color. Looking at its icon, you can infer that it’s a database query.

‘Span details’ and ‘Stack trace’ of the slow database query

‘Span details’ and ‘Stack trace’ of the slow database query

Kinsta APM crunches the stack trace of this span and identifies the plugin generating this taxing database query.

Here, it’s a plugin named woocommerce-related-products. It’s a WooCommerce extension that dynamically generates a slider of related products for every individual product page based on various criteria.

The ‘related products’ slider in a product page

The ‘related products’ slider in a product page

Under the Span details, you can also see the database statement I injected into this WooCommerce extension to simulate this performance issue.

For large WooCommerce stores selling hundreds (or thousands) of products, introducing a new feature, or updating an existing one may cause unexpected performance issues. Problems like the one shown above are quite common. Kinsta APM makes it easier to diagnose and fix them.

Frustration. Annoyance. Disappointment. All things customers could feel if your ecommerce site has performance issues. 😬 Get in front of the problem with our built-in APM feature & start monitoring your site ASAP ✅Click to Tweet

Summary

We live in a fast-paced world where you can access almost anything 24/7. Whether it’s a small business or a large enterprise, WordPress and WooCommerce make it super easy to get started with selling things online. And you can find fast themes for both (fast WordPress themes, fast WooCommerce themes).

User experience is the key to an online store’s success, and it depends primarily on its performance. However, as shown in this article, it’s challenging to monitor a WooCommerce store’s performance.

In this article, you learned how to use Kinsta APM to fix WooCommerce performance issues such as long API calls, sluggish dashboard, and slow database queries. By helping you take the guesswork out of the equation, Kinsta APM empowers you to trace down performance problems and resolve them rapidly with minimum disruption.

Get down to business with Kinsta APM today and gain a significant edge in today’s competitive market!

The post How to Fix WooCommerce Performance Issues Using Kinsta APM (Real-World Examples) appeared first on Kinsta®.

WP Hosting

[ continue ]