How to measure your checkout load time
Every second of additional checkout loading time can drive away customers. Quick checkout load is especially important for customers shopping on mobile devices, where over 20% of ecommerce purchases today are made.
Slow site load times have been shown to reduce conversions and ultimately impact your bottom line. Nowhere is this more important than at checkout, when your customer is ready to make a purchase.
The industry uses a term called “Time to Interact,” which is the time at which your checkout page is ready for a user to enter information. While Time to Interact and load time are not exactly the same, our step-by-step instructions for measuring load time are a good proxy for measuring your checkout pages’ performance.
See our step-by-step instructions on how to measure your site’s checkout load time below.
This test of Levi’s, Allbirds, and Macy’s PayPal checkout load times was conducted from Bolt’s San Francisco office, with 132.5 Mbps download speed (very fast). Bolt average load time calculated across all Bolt Checkouts over a month-long period.
Step-by-step: Measuring checkout load time on your site with Chrome DevTools
You can measure the checkout load time on your site by using Chrome’s Developer tools.
1. On your ecommerce site, add an item to your cart and navigate to the cart page
2. While on the page, press Command + Option + I (on Mac) or Control + Shift + I (on Windows or Linux) to open Chrome DevTools.
3. Click the Network tab on the Chrome DevTools panel.
You should come to a view like the above. The list of websites on the panel is the full list of requests that your site is making to get data or assets for the page.
At the bottom of the list of websites, you’ll see the total number of requests, amount of data loaded, and loading time of the page. In the above example, it took the page 3.19 seconds to load 45 requests with 7.3 KB of data.
4. Navigate through the steps of your checkout.
The checkout process on most ecommerce sites 2 or 3 pages. As you load each page, the data requests and the loading time on the DevTools panel will reset. Keep note of the loading time of each page.
On the above example with a demo Shopify store, the total loading time for checkout was 3.15 seconds for the first page and 2.56 seconds on the second page of checkout.
Once you’ve finished the checkout process, add up the load times on each page to get your total checkout load time. This is the total amount of dead time that a customer must wait as they go through the buying process.
Note: Checkout loading times vary by browser, device, and network. Of course, a customer making a mobile purchase in a poor service area will have a much slower loading time than someone in an office downtown.
DOMContentLoaded vs. Load time: Chrome DevTools reports two separate timed events on page load. DOMContentLoaded is the time it takes for the HTML on the page to be loaded and parsed. Load time includes the time it takes for Chrome to load stylesheets, images, and other external resources. It’s possible to interact with the checkout interface when the page is fully loaded (though other scripts can continue to run after load, as indicated by the “Finish” time). So, we use Chrome’s “load time” to measure a checkout page’s load time.
Pushing the checkout frontier with instant load at Bolt
At Bolt, we’re obsessed with perfecting the commerce experience.
This month, we launched instant load for Bolt Checkout. That means that when a customer clicks the Bolt Checkout button, the average time to interact is under 1 second.
We do this by pre-loading Bolt Checkout in the background when a customer reaches your site’s cart page. This allows your customer to get through checkout even faster than before.
(Note: there’s a high variance in time to interact based on the user’s device and network. Nevertheless, we keep load times ultra fast, with an average time to interact of 800 milliseconds and 95% of times under 2.2 seconds.)
Check out this GIF of Bolt Checkout as used by Swissgear, one of our partners.
The reason we’re relentlessly working on the checkout experience is that time truly is money when it comes to ecommerce.
The bottom line impact of checkout load time
Each second of page load time is correlated with a 7% decline in conversions [Neil Patel].
Other studies have shown that for ecommerce sites, slow loading time is strongly correlated with lower revenue growth [Wolfgang Digital].
According to Wolfgang Digital, more than half of sessions take place on mobile devices. In contrast, 26% of ecommerce revenue comes from mobile devices. That means that sites that can capture customers when they’re mobile have a huge advantage at catching customers where they actually browse.
The same study reported that the share of ecommerce revenue coming from mobile devices grew 19% from 2016 to 2017. The mobile opportunity is large, and growing. Ecommerce sites need seamless checkout experiences to keep up with their users.
At Bolt, we’re focused on providing the best technology in checkout to all ecommerce sites.
When it comes to checkout load times, we reported our average checkout load time of 1.6 seconds last month, compared to 5-20+ seconds on most ecommerce websites. Instant load is helping us push this boundary even lower.
This improvement in checkout loading times — along with our seamless guest checkout and single-click checkout for returning customers — is what allows us to drive 10-100% revenue lift for our partners. For examples of our work with ecommerce sites, see bolt.com/case-studies.
If you’ve made your way to this article, then you’re likely a retailer on WooCommerce looking to reduce checkout abandonment, drive conversions, and increase revenue – using a WooCommerce one page checkout design. This article will teach you how to…
A lot of time goes into the design of your ecommerce website. You want it to be appealing, fit your brand, and operate smoothly. Your ecommerce checkout is a main part of how customers interact with your online store and…
To get traction with an online store, you need to have a great checkout page design. It can often be difficult to know where to start or what features are most important. With so many competing recommendations around building an…
Want to see a 5-minute demo?