Google Tag Manager

Introduction

In today’s digital marketing landscape, data-driven decision-making is paramount for businesses seeking to thrive. Enter Google Tag Manager (GTM), a powerful tool that allows marketers, analysts, and developers to deploy tracking tags and collect valuable insights about website performance and user behavior. However, while GTM facilitates the management of tracking tags, it can also influence a critical aspect of online success: page speed.

Evaluate the Impact of Tags

Google Tag Manager
Image Credit: SEMrush, 2023.

To comprehend the key factors in relationship between Google Tag Manager and page performance, it’s vital to evaluate the impact of different types of tags. Not all tags are created equal, and each has its own footprint on your website’s speed. Some tracking codes, like Facebook Pixel or analytics scripts, can potentially slow down your site, especially when too many tags fire at once.

Custom HTML tags, particularly those that manipulate the DOM, can have a negative impact on page load times, especially when using a custom html tag. The use of heavy JavaScript code, such as document.querySelectorAll, can delay rendering and degrade overall website performance. It’s important to identify specific tags that may be harming the loading process and restructure their tag configuration accordingly. By using fewer tags and regularly auditing and removing unnecessary ones, you can improve website performance and load speeds.

Prioritize Tag Management

Google Tag Manager

To prevent Google Tag Manager slowing down your site, regular container audits are essential. Using fewer tags in Google Tag Manager can significantly improve website performance and load speeds. Over time, a GTM container may accumulate redundant tags, outdated JavaScript libraries, or more tags from prior marketing efforts. Too many tags, especially those not actively used, can contribute to performance issues and increase page load time.

Collaborating with developers to remove tags or consolidate certain tags can reduce clutter and improve website’s performance. Use your GTM account to review trigger types, such as page view triggers, and assess whether some tags fire unnecessarily across different events.

Delay Less Important Tags

Google Tag Manager
You can see here one tag is set to delay and only fire after a visitor views their Order Confirmation page.

While some tags are crucial for immediate execution, not all tags require instantaneous firing on web pages. One strategy to enhance page speed is to delay the activation of tags that are less critical or that can tolerate some delay, focusing on when and how tag fires occur. The common practice of triggering tags on “All Pages” or the user-defined “Page View” event can lead to increased page loading times, particularly on slower connections.

Our experience has shown that delaying tags to fire on events like “DOM Ready” or “Window Loaded” can produce noticeable improvements in page loading performance. Moving beyond “Page View” triggers, which can potentially hinder the loading of essential page components, is key to optimizing page speed. In fact, some advanced setups even delay tags to fire 1.5 seconds after the “Window Loaded” event, resulting in substantial gains in fully loaded metrics, particularly on slower connections.

Deciding which tags to delay shouldn’t be a unilateral decision. Collaboration is paramount. Different stakeholders, including developers, marketers, and analysts, should participate in discussions about which tags can be deferred without compromising data accuracy or business objectives. For example, tags related to chat widgets or certain remarketing efforts could be excellent candidates for delayed firing, as long as they don’t disrupt user experience.

In addition to optimizing page speed, it’s crucial to fine-tune your tags for precise conversion tracking. By striking the right balance between tag firing timing and speed optimization tracking accuracy, you can ensure that your Google Ads and Google Analytics conversion tracking remains effective.

Avoid Heavy DOM Manipulations


Custom HTML tags within GTM can be incredibly powerful when prototyping or testing certain webpage elements. However, it’s essential to recognize that GTM is not a long-term solution for complex DOM manipulations that demand substantial computational resources. Custom HTML tags that require the browser to iterate through every element on a page and perform extensive checks, particularly if combined into one script, can lead to noticeable delays in page loading.

The impact of these tags on webpagetest.org results may not be groundbreaking, but their influence on user experience can be significant. To illustrate, consider a scenario where multiple Custom HTML tags are used to inspect and manipulate various elements on a page. While the impact on page load times might not be immediately apparent, it’s essential to understand that these tags can affect the “Time to Interactive” metric, potentially causing the site to remain unresponsive for longer periods during the initial page load.

In practice, it’s advisable to use GTM for initial testing and proof of concept when implementing DOM manipulations. However, for long-term solutions and apps that require resource-intensive operations, collaboration with developers to implement efficient code without extensive DOM manipulations is the preferred approach. By doing so, you can ensure a smoother and more responsive user experience without compromising on page speed.

Server-Side Tracking


Displaying a possible configuration for setting up Server Side tracking for Google Tag Manager

In today’s digital marketing landscape, data-driven decision-making is paramount for businesses seeking to thrive, particularly in relation to website speed . Enter Google Tag Manager (GTM), a powerful tool that allows marketers, analysts, and developers to deploy tracking tags and track user behavior to gain valuable insights about website performance and conversion data. However, while GTM facilitates the management of marketing tags, it can also influence a critical aspect of online success: page speed.

While server-side tracking offers considerable benefits, it’s essential to note that it introduces added complexity and variables to your setup. As a result, comprehensive configuration and optimization are required to reap the full rewards of this approach. For those ready to embark on this path, exploring intermediate and advanced GTM courses that delve into server-side tracking is highly recommended.

GTM Preview Mode



As you enable the preview mode, you will now see two windows: a Tag Assistant window and the window you’re testing.

GTM’s Preview and Debug mode, a valuable tool for testing and verifying tag implementations, can impact page speed when enabled. When active, the mode introduces additional browser load, as indicated by pagespeed insights especially as the container size grows. Moreover, on every dataLayer.push event, every variable within the GTM container is reevaluated, intensifying the browser’s workload.

To gauge the impact of GTM Preview and Debug mode, our experience has revealed a noticeable slowdown in web page performance. Double-digit increases in the “Time to Interactive” metric and a spike in Max First Input Delay (FID) were observed. The latter metric reflects the potential delay between a visitor’s click and the resulting action on the page, often exceeding several seconds.

While it’s challenging to eliminate the impact of preview mode entirely, it’s essential to note that the negative influence has decreased with recent browser updates. However, it remains advisable to minimize usage, enabling it only when actively debugging. Additionally, avoid measuring page speed with the environment snippet enabled, as it can place extra demands on GTM, particularly during initial load and JavaScript execution.

With the introduction of Tag Assistant, which replaces Tag Manager’s preview mode, the system has undergone fundamental changes to adapt to modern browser restrictions on third-party cookies. Tag Assistant is designed to work seamlessly without the need for third-party cookies or extensions. As you enable the preview mode, you will now see two windows: a Tag Assistant window and the window you’re testing. Google continues to improve this experience, introducing new features to help you debug your containers and enhance your tagging process.

Test the Page Speed


Testing MAKDigital on webpagetest.org

Page speed testing is a free but crucial practice to uphold the performance of your website. Rather than waiting for red flags from the IT department, adopting a proactive approach by testing regularly is essential. Testing should encompass a range of connection speeds, including both fast and slow, to obtain a comprehensive view of your website’s performance under varying conditions.

BBy incorporating page speed measurement and testing into your routine, you ensure that you stay lean and responsive. Testing after each change to the GTM container would be ideal, but at the very least, perform tests after major updates or additions. Monitoring page speed allows you to detect issues promptly and implement corrective actions before they affect user experiences negatively.

Balance Business Priorities

In the pursuit of optimal page speed, it’s crucial to strike a balance between technical optimization and business priorities. While achieving a perfect page speed score might be appealing, it’s not always the most practical or profitable objective. Instead, focus on aligning website performance with broader business goals and revenue generation to optimize both.

Consider this scenario: Adding a JavaScript script that measures ad efficiency and reallocates budget to top-performing ads may introduce a performance hit but lead to increased revenue and profit. In such cases, the trade-off is justifiable. The key, in short answer, is not to blindly chase perfect scores but to analyze and make informed decisions that serve the overarching business objectives effectively.

Avoid being overly greedy or careless when implementing tracking vendors and analytics scripts. Evaluate whether each component genuinely contributes to your objectives. For instance, do you need 15 tracking vendors on your site, or can some be consolidated? Additionally, always involve developers in the implementation process, as their expertise can help prevent unforeseen issues that might disrupt user experiences.

Collaboration and Communication

Effective collaboration and communication among teams and departments are central to optimizing GTM while maintaining page speed. Achieving the right balance between tracking, particularly user interactions, and performance requires input and consensus from different stakeholders, including developers, marketers, and analysts. Each perspective contributes to the decision-making process regarding tag placement and delay strategies.

Recognize that developers and marketers may have differing priorities for tag management system. Developers may prioritize performance optimization and advocate for delaying or optimizing tags to enhance page speed. In contrast, marketers may seek to maximize data collection and may favor immediate tag firing. The challenge is to bring these diverse viewpoints into alignment, considering the impact on both performance and data accuracy.

Continuous Learning

As you embark on the journey of optimizing page speed while managing Google Tag Manager, embrace a mindset of continuous learning. Share your experiences and insights with peers and colleagues, and be open to learning from their experiences as well. The digital landscape is constantly evolving, and staying informed about best practices is essential.

By exchanging knowledge and staying attuned to industry developments, you’ll be better equipped to adapt and refine your strategies over time. Remember that every website and business is unique, and the optimal approach to GTM and page speed may vary. Continuous learning and adaptation are key to achieving lasting success in this dynamic field.

Conclusion

In conclusion, optimizing page speed with Google Tag Manager requires a strategic blend of technical insight and business alignment. By evaluating your tag manager setup, reducing redundant tags, delaying non-essential tags, avoiding heavy DOM manipulations, and embracing server side tagging, you create a robust strategy that enhances both page load time and data reliability.

Regular audits, clear communication, and continuous learning will ensure your GTM container supports—not hinders—your digital performance. Remember: every tag has an impact. The goal isn’t just to fire tags—it’s to fire the right ones at the right time for maximum value with minimal friction.

Written by Mitch McDevitt
Written by Mitch McDevitt

Mitch is an experienced eCommerce Project Manager specializing in delivering seamless online experiences and driving digital growth. With expertise in project planning, platform optimization, and team collaboration, Mitch ensures every eCommerce initiative exceeds expectations. Passionate about innovation and results, Mitch helps businesses stay ahead in the dynamic digital landscape.

0 0 votes
Article Rating
Subscribe
Notify of
guest
0 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments