What Should Time To Interact (TTI) Be For Checkout Pages?
For the checkout page on your e-commerce site, time to interact (TTI) should be 3.8 seconds or less. According to Google’s Web.dev blog, 0 to 3.8 seconds is fast, 3.9 to 7.3 seconds is moderate, and anything above 7.3 seconds is slow.
Time to interact is the point when a user can interact with a web page element once the page has rendered. For example, after a shopper clicks the add-to-cart button, TTI measures the time it takes for an interactive element on the next page to become usable, such as the checkout button.
Most people only rely on page load time to optimize their website for speed, but TTI is a better measure of site performance because it directly affects user experience.
Measuring Time to Interact
The easiest way to measure time to interact is by running a Lighthouse audit on your checkout page in the Chrome browser.
To start, disable any third party extension that’s in your Chrome browser, then add a product to your cart and click your checkout button.
Type CTRL + Shift + i (for Windows) or CMD + shift + i ( for MAC) to open the developer tools in Chrome, then navigate to Lighthouse. After this, click Generate Report. You will see your time to interact under the Performance Metrics section.
If your checkout process is more than one step, go to the next step and run this process again. Then add the TTI recorded for both pages together to get the overall time to interact for your checkout process.
You can also get this information from performance monitoring tools like New Relic.
Improving Time To Interact
The faster a visitor can interact with your checkout page, the greater chance you have of making a sale rather than a visitor abandoning their cart. Numerous studies, such as this one, associate page load time with revenue, showing that reducing page load time by 1.6 seconds could increase revenue by about 10%.
Your site speed is tied to your time to interact. So, your first focus should be improving the average page load time of your e-commerce site.
To improve site speed, it’s vital to improve your site’s code, including your JavaScript payloads. Sending large files impacts your checkout page’s load time significantly, so split them up and send each piece when necessary rather than all at once.
Most importantly, use a headless commerce architecture. That way, rather than having all your resources load from one server, you only have the resources necessary for your checkout page load when needed rather than all at the same time.
Furthermore, simplify your checkout page. Add only the necessary information to it. Other marketing details such as pop-ups and upsells can come after they click the checkout button. That way, those resources don’t load simultaneously with the important checkout resources.
Tech advocate and writer @ fabric.
Related Content
