6 Advanced Hacks to Improve Page Load Speed
To generate more revenue for your business, your website constantly relies on dozens of third party services that enrich your site experience, engagement, and ultimately your bottom line. As a digital executive, you choose to integrate these external vendors in your website ecosystem because each of them delivers unique value. For example, web analytics and personalization tags help you better understand and engage your target audience. Ad networks let you monetize your site, engagement platforms, AI-powered chatbots, and other digital commerce technologies allow you to boost customer engagement and increase conversions and other key online metrics.
If anything, third party services will continue to multiply as the digital landscape becomes increasingly competitive.
However, as your reliance on these external vendors increases so does the need to understand their flipside. The steady proliferation of third-party services alone makes managing them more challenging. But it only starts there.
Third party services introduce hidden costs that are not as readily apparent. Along with the value these services bring come impacts on site performance, and risks to site security and privacy. When these hidden costs are taken into consideration, you can more accurately measure the net value of your third-party services:
Service Net Value = Service’s Added Value – Performance Cost
The reality today is that every service comes with a cost: Your users can’t — and won’t — differentiate between your site performance issues and those caused by third-parties. For them, the result is the same: The page didn’t load fast enough, and now they are leaving your site with a negative impression.
Our goal in this guide is to provide you with tools to better understand the cost of your third party services and to demonstrate best practices to reduce their impact on your site and business metrics.
Want to read the rest of the eBook?
Fill in the form below and read the next chapters!
Strategy 1 Discover the True Footprint of Your Services
The first step in understanding the impact of third party services is knowing what is actually running on your site. As simple as this may sound, many online publishers lack this awareness. With so many external vendors being introduced into your site’s ecosystem, gaining greater visibility into your third party services is crucial to understanding which services are impacting your performance and business metrics. Additionally, most existing web tracking tools don’t specifically focus on third party services.
Unfortunately, full visibility doesn’t end with third party services. In order to perform their tasks, many third party solutions rely on external vendors, technologies, or data — fourth parties. Additionally, many of these fourth parties enlist outside vendors to perform as well, extending this unauthorized data access to fifth party services. These fourth, and often, fifth party services are also running on your site and impacting your performance, and in some cases, can cause a major failure to your digital operation.
Do you really know all the software currently running on your site?
What’s just as disconcerting is that, in many cases, your organization is simply unaware of these fourth and fifth party services running on your site — and without your authorization or visibility. The authorizations you’ve granted were meant to be limited solely to your third party service. But now, fourth and fifth party services are also accessing your data and impacting your site performance.
Fourth party services can harm your business in two major areas: site performance and privacy.
A classic example of this is a Data Management Platform (DMP) that manages your visitor database. When you added this service to your ecosystem, you gave it permission to access and manipulate your visitor data. However, this third party vendor requires the services of a different analytics tool. This fourth party analytics tool provides the third party what it needs — but it also collects data on your users. In this example, you have exposed your organization to a service that collects data on your users without your permission. Not having visibility into your software vendor ecosystem makes it impossible to track and control who has access to your visitor data and how they are using it.
To illustrate how wide the impact is of these 4th parties, below is an example published by Radware of a single third party call that triggers over 49 fourth party calls the website admin was unaware of, and could not track their impact on the website.
In this example, a third party code was integrated into a website. As you can see in the image below, it generated a cascade of fourth party service calls to many other sites. The website admin most likely didn’t realize how this single snippet of code would trigger fourth party codes that could directly impact their site performance and privacy.
Here’s a quick breakdown of the result of this one line of code:
- This “simple” third party tag triggered 49 server calls to various unknown fourth party servers.
- Of these 49 fourth party calls, 21 are redirects (Indicated by the red dots). The result: a ping-pong effect, as each redirected call ricochets from server to server, wasting valuable load time.
- Every one of these fourth party calls is over SSL. While providing secure access to your web property, it’s important to be aware of potential impacts on load times
- What this adds up to: All of these fourth party calls add 1.8 seconds to the page’s load time.
Considering how challenging it already is to track all of the service impacts caused by your third party services, you most likely haven’t taken all these fourth party calls into consideration. In a nutshell, the impact of third party services’ code on your site performance is almost always much higher than you would have anticipated.
Although there are several ways to determine which services are running on your site, not all of these methods will highlight the fourth and fifth party dependencies. One way you can do this is by using Namogoo’s Digital Insights tool.
Here is an example of a dependency map created with Namogoo’s Digital Insights solution. This map visualizes all third party services running on a website and displays each service’s dependencies on fourth and fifth party services.
Strategy 2 Monitor Third Party Code Updates
The nature of cloud services is that they are constantly changing. A typical website today has around 75 services installed, each requiring regular code updates. Each service’s code usually changes a few times a month: This means you have over 200 code changes per month on your website that you need to manage.
Left unmonitored, code changes can damage your site functionality by introducing errors and increasing load and fetch times. As a result, most online businesses do their best to minimize this risk by ensuring a staging environment and enforcing a code freeze before periods of high traffic (i.e. Black Friday for online retailers and peak news cycles for online publishers).
Here are three major risks third party code changes pose to your site:
1. Downtime and crashes
Third party code changes have the potential to cause errors across your website. Although you might be implementing many tests before uploading any new service to production, code changes can fly under the radar. As a result, these changes don’t receive proper attention from your digital operations team. Keep in mind that a service with new code is virtually the same as installing a new product on your site.
2. Privacy violations
3. Compromised performance
Even though you may have tested this tool many times in the past, it’s no longer relevant since each code change may have also changed the way your website interacts with the software.
One way to mitigate these risks is to engage your third party service and ensure a code freeze before critical events as well as a monitoring mechanism to ensure this rule hasn’t been violated. You should also maintain open communication with your third party services. For example, during an upcoming election, a local media outlet can expect an elevated volume of traffic. For many media outlets this is a time of heightened code scrutiny, and in extreme cases, a code freeze. However, this doesn’t stop your third party services from applying code changes during that time. Alerting your third party services about peak traffic periods can help mitigate risks of code errors and compromised performance.
Since many publishers use over 75 services that are updated several times a month, staying on top of these code changes can be challenging. To best monitor these code changes, make sure you’re equipped with the appropriate third party services monitoring tool.
Strategy 3 Minimize the Impact of Your Third Party Services on Content Above the Fold
The impact of any content or service appearing at the top of the page is much higher than content placed anywhere below it. To optimize user experience and engagement, web pages are rendered according to priority from top to bottom, to ensure the most critical content is made available to users first.
The area on the page which is crucial for the user to start taking action is called “above the fold”. This is the content your customers see without scrolling (in technical jargon, this is called the critical rendering path) whereas content below the fold refers to any content viewed after scrolling.
Since content above the fold has a higher impact on your site, it’s first important to understand where your third party script is located in the code, and if it is rendered above or below the fold. To do this, you need to identify the portion of the HTML that represents the division between the two.
If you’ve identified that the third party service’s code is above the fold, the next step is determining whether it’s essential for it to be there. If it isn’t, you can move it further down to optimize user experience above the fold.
Strategy 4 Optimize Third Party Performance
The previous strategies focused on visibility and monitoring of your third party services. But to fully maximize your page load times, you’ll also need to improve their performance.
There are four main ways you can implement this:
1. Minify your third party services’ codes
2. Ensure your third party files are compressed using Gzip
4. Make sure your third party services use a Content Delivery Network (CDN)
Minify your third party services’ codes
There are many ways to reduce the size of a code script. One of the most common and proven methods is minification — the process of removing all unnecessary characters from source code without changing its functionality. These unnecessary characters usually include white space characters, new line characters, comments, and sometimes block delimiters, which are used to add readability to the code, but are not required for it to execute.
Unfortunately, you won’t be able to minify your vendors’ codes by yourself but you can contact the service provider and request they provide a code that went through minification.
Ensure your third party files are compressed using Gzip
Another popular method for reducing the size of your code is to compress it using gzip. Similar to minification, the result of gzipping is a smaller file size resulting in better web performance and page load time. Gzipping can reduce file size by as much as 90%, saving bandwidth and download time while also maintaining the high quality of your rich content.
In order to make sure your third party codes are compressed using gzipping, check your pages network code, search for your third party resources and make sure that the response header for each resource contains gzip under the content Encoding line.
The major benefit of using asynchronous structure is that it reduces the impact of third party codes’ weight on your page load time. Moreover, the async attribute prevents any blockage of the rendering path, so your site can load without waiting for these scripts to finish. Using this best practice lets your browser fetch files while continuing to render the page.
Make sure your third party services use a Content Delivery Network (CDN)
When users from Australia visit your website and the content they want is sitting on a server in New York, they’re going to receive a delayed experience of your site. Worse yet, if anything happens to that server in New York (e.g. power outages, weather, security attacks), it will affect your data transfer to all your end users.
That’s where a CDN comes in. CDNs are like nomadic servers that host your site’s content and deliver it according to various factors such as proximity and available bandwidth. Sharing traffic among multiple servers allows the CDN to fetch a file from the closest location to your user, improving speed. CDNs possess the computing power needed for file serving, and their ability to better balance increased load without crashing helps ensure reliability of service.
When your web page tries to load a third party code, this process is far more likely to be smooth if this code is being hosted on a CDN rather then the service provider’s server.
Talk to your third party provider to make sure they’re using a CDN optimized for hosting external assets that can deliver all of them within relevant proximity to your users. Also, make sure the third party service is using a reliable CDN network.
Strategy 5 Continuously Test Third Party Performance Impacts
As mentioned in Strategy 3, third party services constantly change their code. For this reason, the test you run when you examine a service before fully deploying it to your site is no longer relevant once deployed. It is vital to adopt an ongoing testing protocol to make sure your third party services’ performance impacts do not exceed your organization’s requirements.
Using performance monitoring tools, you can continuously test different third party services after adding them to your site. One option is to manually create periodical tests that randomly select a third party service and exclude it from a small portion of your traffic. This can help the website admin better understand the effect of that service on the website’s performance. Keep in mind that applying this method requires substantial in-house human and technology resources.
A more efficient option is to apply a third party services monitoring tool that allows you to identify in real time the services impacting site performance metrics such as fetch time, file size, DOM updates, and errors. The ability to measure these metrics over time is critical to making sure your third party services’ impact on performance is aligned with your expectations.
Strategy 6 Understand How Services Impact Metrics on Critical Sections Of Your Site
One of the most important website performance metrics is page load time. There’s a wealth of research detailing the direct correlation between page load time and key business KPIs such as click-through rates (CTR), revenue per visitor (RPV), and user engagement. However, it is important to understand that page load time does not impact every section your site equally. In fact, this impact can vary significantly depending on the section of your site that’s affected.
In the previous sections, we talked about the importance of understanding the impact of third party services on page performance. But there are two more important factors to take into account:
1. What sections of your site each service is impacting
2. Which sections of your site most impact your business KPIs due to changes in page load time
In eCommerce, a one-second delay in page load time on a product page may have a much higher impact on conversions compared to a one-second delay on your homepage. This can translate into considerable losses in revenue for online businesses. For example, a one-second delay for a website generating $100,000 per day can cost approximately $2.5 million in sales every year. By comparison, optimizing this metric can pay off substantially: Cutting your page load time by three seconds can increase revenue by 7 to 12 percent.
The following examples illustrate research conducted on two major U.S. eCommerce brands:
In this research, we compared the impact of page load time on performance within different sections of the site. The results significantly differ between sections. In the three examples above, we can see that the daily sales section on the site is much more sensitive to page load variations compared to category and home pages (the slope is much steeper in the daily sales section compared to other ones on the site).
It’s important to understand which pages your services are impacting. Once you have this data, you need to determine how crucial this service is to those sections. If not, you can remove it or take other actions to improve that section’s performance.
To effectively compare the services you have running on your site, you need to standardize and score your data so you can actually compare apples to apples.