Alex Painter - 2 July 2018
While it may seem like a distant prospect, Black Friday is coming and retailers are busy preparing for the busiest shopping period of the year. The holiday season is normally a busy time for us too, as we start carrying out performance tests on retail sites to get an idea of how they’ll behave when unprecedented visitor numbers put systems under equally unprecedented strain.
At the same time, we’re setting up a lot of organizations with synthetic monitoring and real user insights. Synthetic monitoring is a way to make sure your key user journeys are running as expected and to highlight any important trends or anomalies in load time or availability. Real user insights gives you insight into what visitors are actually experiencing and is the perfect way to understand whether certain user segments or certain pages are seeing problems. Crucially, Real user insights can also tell you the extent to which page load times correlate with the KPIs your business really cares about — conversion, bounce rate, engagement, and revenue.
Many people already have real user monitoring (RUM), a mechanism for profiling how transactions from real users flow through your system. Real user insights is very different — it's about understanding user behavior (rather than technical behavior), what user behavior leads to a conversion or business outcome, and how that user behavior and business outcome is driven or impacted by technical behaviors such as performance. RUM is about the data center and the back end; real user insights is about the business outcome and how to change it.
Get Full Value From Your Monitoring Service
Part of our job is to make sure our customers get full value from both kinds of monitoring. And part of this means identifying the bottlenecks — the pages in key user journeys that could be the difference between success and failure if they’re too slow.
One good starting point is the Worst Performers report in real user insights. This highlights pages that are particularly slow for your visitors, or for a certain group of visitors, such as mobile users or people in a certain geographic area.
In the example above, the further the page is along the x axis, the slower it is, and the further it is up the y axis, the more traffic it gets. So, pages toward the top right are a particular concern, but even relatively low traffic pages may be worth investigating — especially if they’re key points in the purchase journey and represent opportunities for shoppers to abandon that process. This kind of visualization can be particularly useful in identifying clusters of similar pages that are all slow for the same reason, and it looks like there may be at least four distinct groupings in the above report.
Once you’ve identified the pinch points, the next step is to understand why those pages are too slow. Are there back-end processes that are hitting response start times? Or is something else at play?
Optimize Your User Journeys
This is where diving a little deeper into network traffic and an object-level view of the web page can be invaluable, and we’ll typically use something like Performance Analyzer to understand what’s going on. Often, it’s the simple things. Large text files are being delivered uncompressed. Images aren't optimized. Cache lifetimes for static resources are too short. But once you’ve got past the simpler fixes, there are one or two other things you can do to make your journeys look super-fast to your end users.
One approach is to load only the resources that are absolutely necessary to display the current page and prefetch the ones you need for the next steps in the journey. For example, you want to keep your landing page as lean and as fast as possible because visitors won’t normally have assets for that page in their browser cache. So, ideally, you should initially load only the necessary resources for that page. That might mean using a dedicated template for the page that contains only the CSS required to display it and the scripts that are absolutely essential to make it work, without loading in sitewide styles and scripts. The aim is to make your landing page as fast as it can be to maximize visitor conversions and minimize abandonment.
But what about the next step in the journey? By limiting the resources loaded on your landing page, you’ve made it faster. However, because the user doesn’t now have sitewide resources stored in their browser cache, the next step could actually be slower. This is where prefetching comes in to make the most of browser idle time and load in resources that aren’t required on the current page, but will be soon. Crucially, loading these resources doesn’t interfere with how the current page loads and displays. Instead, they’re brought in when the browser isn’t busy doing something else — most likely between the page loading and the user deciding where to go next. So, by the time that user does decide to navigate to the next page, they’ll have some of the key resources needed for it. The result is a much faster, smoother journey.
Better still, prefetching is very simple to implement:
<link rel="prefetch" href="/next_page_styles.css">
This technique is perfectly suited to user journeys that start on a campaign landing page because there is normally a very clear path that you want users to follow. It’s something worth bearing in mind in the lead up to Black Friday. As well as ensuring that you have the capacity to deal with the expected traffic and monitoring set up to understand how your site is responding to it, it’s worth spending some time ensuring that your key user journeys are as fast and as streamlined as possible.
Even if Black Friday doesn’t apply to you, every organization could benefit from a faster, high-performing website. Request a demo to see how Digital Performance Management can help you improve business KPIs.