SYS-CON MEDIA Authors: Pat Romanski, Liz McMillan, Yeshim Deniz, Elizabeth White, Courtney Abud

Blog Feed Post

Using Catchpoint to Analyze Third-party Impact

Modern websites are increasingly dependent on third-party services for most of the features it provides like widgets, ads, social marketing tags, page analytics, conversion tracking, etc. Performance optimization is no longer limited to managing the size and format of the images embedded on a webpage and the page itself; it also boils down to the number of third-party tags, hosts, and number of requests on that page.

Third-party tags are a performance overhead. We have discussed the toll third-party components take on performance in multiple blogs, listed below.

In short, the more third-party tags you have on your website, the more requests will have to take place on the page, which will likely lead to a delay in page load. If not optimized, such tags can cause:

  • the page to load slower
  • the page to not render properly
  • the page to display errors or not load at all

Getting to the Root

A website outage or degraded performance can be the result of many different factors. The root cause analysis can get tricky when the page is complex with multiple hosts and third-party components. Resolving such performance issues becomes difficult when third-party services are involved; it requires specific tests and targeted troubleshooting.

Catchpoint has assisted many customers in analyzing and understanding performance slow-downs caused by third-party services. Our solutions are built to make it easier to drill down to specific components of the page to aid in faster resolution time.

Let’s look at two specific Catchpoint features that allow you to identify third-party issues easily.

1. Request Block

Catchpoint allows you to add/modify the headers that are sent during a test. These are configured under the “Request” section when creating a test.

The Request Block option allows you to specify the requests to be blocked when executing the test; this will help determine if a particular request is causing the performance degradation. The image below shows where to set this up:

http://blog.catchpoint.com/wp-content/uploads/2018/01/reqblock3-300x69.jpg 300w" sizes="(max-width: 736px) 100vw, 736px" />

This is an important feature when troubleshooting third-party tag’s performance. You can measure the impact specific requests have on the overall load time. For example, in the image below we compare the Render Start and Document Complete metrics of a website before and after blocking requests.

http://blog.catchpoint.com/wp-content/uploads/2018/01/reqblock2-300x142.jpg 300w, http://blog.catchpoint.com/wp-content/uploads/2018/01/reqblock2-768x363.jpg 768w" sizes="(max-width: 953px) 100vw, 953px" />

http://blog.catchpoint.com/wp-content/uploads/2018/01/reqblock1-300x161.jpg 300w, http://blog.catchpoint.com/wp-content/uploads/2018/01/reqblock1-768x412.jpg 768w" sizes="(max-width: 857px) 100vw, 857px" />

The page takes almost 7 seconds to start rendering. Compare this to the metric values after the requests are blocked: the page loads within 7 seconds versus the 12-13 seconds it took without request block enabled. By breaking down the data by “Hosts” and “Zones,” we can drill down even further and identify the exact requests that have become a performance bottleneck.

2. Request Delay

Another Request Header we can use is “Request Delay.” This forces the browser to delay specific requests for a set interval. We can see the difference this makes to the load time in the images below:

http://blog.catchpoint.com/wp-content/uploads/2018/01/reqdelay1-300x73.jpg 300w" sizes="(max-width: 614px) 100vw, 614px" />

http://blog.catchpoint.com/wp-content/uploads/2018/01/reqdelay-300x140.jpg 300w" sizes="(max-width: 657px) 100vw, 657px" />

http://blog.catchpoint.com/wp-content/uploads/2018/01/reqdelay2-300x213.jpg 300w" sizes="(max-width: 662px) 100vw, 662px" />

These two features can also be used in A/B testing to evaluate the performance of third-party services that you plan to implement on your website.

Are tag managers the answer?

When it comes to optimizing third-party components, one of the recommended options is the use of a tag management system. Tag managers have several advantages:

  • Checks if all the tags are updated
  • It helps load tags faster and asynchronously
  • Ensure tags load only on pages that need it
  • If a tag doesn’t work then it gives you the option to disable or remove the tag

But all these advantages don’t translate to better performance if the tag management itself is not optimized. Take the example below:

http://blog.catchpoint.com/wp-content/uploads/2018/01/grapha-300x76.jpg 300w, http://blog.catchpoint.com/wp-content/uploads/2018/01/grapha-768x195.jpg 768w, http://blog.catchpoint.com/wp-content/uploads/2018/01/grapha-1024x260.jpg 1024w" sizes="(max-width: 1574px) 100vw, 1574px" />

http://blog.catchpoint.com/wp-content/uploads/2018/01/graphb-300x73.jpg 300w, http://blog.catchpoint.com/wp-content/uploads/2018/01/graphb-768x186.jpg 768w, http://blog.catchpoint.com/wp-content/uploads/2018/01/graphb-1024x249.jpg 1024w" sizes="(max-width: 1574px) 100vw, 1574px" />

The graphs illustrate the impact the tag manager has on page load. Graph A denotes the load time of the tag manager asset and Graph B denotes the time taken for the page to render. There is a clear correlation between the two; the higher the load time of the tag manager, the longer the page takes to render.

In this scenario, the tag manager does not maintain uniform performance across different locations. It works well for users accessing the website from US and Italy, but the tag manager degrades the site performance for users accessing from China and Hong Kong.

A tag management system can make it easier to keep track of all the different third-party tags on your website, but it is important to ensure that it is optimized to handle users from across that globe and doesn’t hamper site performance at different locations.

Conclusion

There’s no debating the fact that unoptimized third-party components can drag your website down. It has a direct impact on page speed and should not be ignored when trying to analyze a sudden performance degradation or outage. Once you have isolated the third party causing the issue using the methods described above, the next step is to ensure you have the following points in place:

  • Always place third-party tags after Document Complete.
  • Use asynchronous JS when implementing the third-party components.
  • Remove unnecessary JS tags from your webpage.
  • Ensure the third-party tags you are using are updated and don’t throw errors.
  • Ensure all the different third part tags load correctly and work without conflicting with other scripts on the page.
  • Finally, if you are using a tag management system then ensure it is optimized and doesn’t degrade website performance.

The post Using Catchpoint to Analyze Third-party Impact appeared first on Catchpoint's Blog - Web Performance Monitoring.

Read the original blog entry...

More Stories By Mehdi Daoudi

Catchpoint radically transforms the way businesses manage, monitor, and test the performance of online applications. Truly understand and improve user experience with clear visibility into complex, distributed online systems.

Founded in 2008 by four DoubleClick / Google executives with a passion for speed, reliability and overall better online experiences, Catchpoint has now become the most innovative provider of web performance testing and monitoring solutions. We are a team with expertise in designing, building, operating, scaling and monitoring highly transactional Internet services used by thousands of companies and impacting the experience of millions of users. Catchpoint is funded by top-tier venture capital firm, Battery Ventures, which has invested in category leaders such as Akamai, Omniture (Adobe Systems), Optimizely, Tealium, BazaarVoice, Marketo and many more.

Latest Stories

VANCOUVER, Canada, Aug. 29, 2018 /PRNewswire/ -- Open Source Summit North America – The Cloud Native Computing Foundation® (CNCF®), which sustains and integrates open source technologies like Kubernetes® and Prometheus™, today announced that Google Cloud has begun transferring ownership and management of the Kubernetes project's cloud resources to CNCF community contributors. Google Cloud will help fund this move with a ...

To enable their developers, ensure SLAs and increase IT efficiency, Enterprise IT is moving towards a unified, centralized approach for managing their hybrid infrastructure. As if the journey to the cloud - private and public - was not difficult enough, the need to support modern technologies such as Containers and Serverless applications further complicates matters. This talk covers key patterns and lessons learned from large organizations for architecting your hybrid cloud in a way that: Su...
Serverless Computing or Functions as a Service (FaaS) is gaining momentum. Amazon is fueling the innovation by expanding Lambda to edge devices and content distribution network. IBM, Microsoft, and Google have their own FaaS offerings in the public cloud. There are over half-a-dozen open source serverless projects that are getting the attention of developers.
Platform9, the open-source-as-a-service company making cloud infrastructure easy, today announced the general availability of its Managed Kubernetes service, the industry's first infrastructure-agnostic, SaaS-managed offering. Unlike legacy software distribution models, Managed Kubernetes is deployed and managed entirely as a SaaS solution, across on-premises and public cloud infrastructure. The company also introduced Fission, a new, open source, serverless framework built on Kubernetes. These ...
As Apache Kafka has become increasingly ubiquitous in enterprise environments, it has become the defacto backbone of real-time data infrastructures. But as streaming clusters grow, integrating with various internal and external data sources has become increasingly challenging. Inspection, routing, aggregation, data capture, and management have all become time-consuming, expensive, poorly performing, or all of the above. Elements erases this burden by allowing customers to easily deploy fully man...
IT professionals are also embracing the reality of Serverless architectures, which are critical to developing and operating real-time applications and services. Serverless is particularly important as enterprises of all sizes develop and deploy Internet of Things (IoT) initiatives. Serverless and Kubernetes are great examples of continuous, rapid pace of change in enterprise IT. They also raise a number of critical issues and questions about employee training, development processes, and opera...
The widespread success of cloud computing is driving the DevOps revolution in enterprise IT. Now as never before, development teams must communicate and collaborate in a dynamic, 24/7/365 environment. There is no time to wait for long development cycles that produce software that is obsolete at launch. DevOps may be disruptive, but it is essential. DevOpsSUMMIT at CloudEXPO expands the DevOps community, enable a wide sharing of knowledge, and educate delegates and technology providers alike.
As you know, enterprise IT conversation over the past year have often centered upon the open-source Kubernetes container orchestration system. In fact, Kubernetes has emerged as the key technology -- and even primary platform -- of cloud migrations for a wide variety of organizations. Kubernetes is critical to forward-looking enterprises that continue to push their IT infrastructures toward maximum functionality, scalability, and flexibility.
This month @nodexl announced that ServerlessSUMMIT & DevOpsSUMMIT own the world's top three most influential Kubernetes domains which are more influential than LinkedIn, Twitter, YouTube, Medium, Infoworld and Microsoft combined. NodeXL is a template for Microsoft® Excel® (2007, 2010, 2013 and 2016) on Windows (XP, Vista, 7, 8, 10) that lets you enter a network edge list into a workbook, click a button, see a network graph, and get a detailed summary report, all in the familiar environment of...
Because Linkerd is a transparent proxy that runs alongside your application, there are no code changes required. It even comes with Prometheus to store the metrics for you and pre-built Grafana dashboards to show exactly what is important for your services - success rate, latency, and throughput. In this session, we'll explain what Linkerd provides for you, demo the installation of Linkerd on Kubernetes and debug a real world problem. We will also dig into what functionality you can build on ...
At CloudEXPO Silicon Valley, June 24-26, 2019, Digital Transformation (DX) is a major focus with expanded DevOpsSUMMIT and FinTechEXPO programs within the DXWorldEXPO agenda. Successful transformation requires a laser focus on being data-driven and on using all the tools available that enable transformation if they plan to survive over the long term. A total of 88% of Fortune 500 companies from a generation ago are now out of business. Only 12% still survive. Similar percentages are found throug...
Technology has changed tremendously in the last 20 years. From onion architectures to APIs to microservices to cloud and containers, the technology artifacts shipped by teams has changed. And that's not all - roles have changed too. Functional silos have been replaced by cross-functional teams, the skill sets people need to have has been redefined and the tools and approaches for how software is developed and delivered has transformed. When we move from highly defined rigid roles and systems to ...
The Kubernetes vision is to democratize the building of distributed systems. As adoption of Kubernetes increases, the project is growing in popularity; it currently has more than 1,500 contributors who have made 62,000+ commits. Kubernetes acts as a cloud orchestration layer, reducing barriers to cloud adoption and eliminating vendor lock-in for enterprises wanting to use cloud service providers. Organizations can develop and run applications on any public cloud, such as Amazon Web Services, Mic...
Implementation of Container Storage Interface (CSI) for Kubernetes delivers persistent storage for compute running in Kubernetes-managed containers. This future-proofs Kubernetes+Storage deployments. Unlike the Kubernetes Flexvol-based volume plugin, storage is no longer tightly coupled or dependent on Kubernetes releases. This creates greater stability because the storage interface is decoupled entirely from critical Kubernetes components allowing separation of privileges as CSI components do n...
With container technologies widely recognized as the cloud-era standard for workload scaling and application mobility, organizations are increasingly seeking to support container-based workflows. In particular, the desire to containerize a diverse spectrum of enterprise applications has highlighted the need for reliable, container-friendly, persistent storage. However, to effectively complement today's cloud-centric container orchestration platforms, persistent storage solutions must blend relia...