Google Tag Manager in Single Page Application, Memory Leak?

user_13579400 0
Viewed 1447

Things are getting interesting...

In a multi-page application, tags are injected by Tag Manager and cleared on every page change/reload.

In a single page application, tags are injected and keep living in the DOM until a manual page reload.

I have just over 70 tags getting fired up on different dataLayer events. Tag Manager injects them all at the bottom of the DOM and they are never removed. If a user views many products, he will end up with hundreds of scripts tags and iFrames in the DOM. This seems to be causing serious memory leaks.

How can I prevent this? Is there something I don't understand using GTM in SPAs? I've searched but haven't found much information. Either people don't care about memory leaks or I'm doing something wrong.

Is there a way to clear all old script tags and iFrames so the garbage collector can do its job and free up some memory?

Thanks for your help, hopefully this thread can help more people facing the same problem as SPAs are getting more popular.

single-page-application google-tag-manager reactjs javascript
2 Answers

To anyone getting a memory leak using GTM and SPAS, here are the pitfalls:

  • Do not use GTM Click on element triggers. They bind click events on everything in the DOM and the garbage collector can't do its job, causing memory leaks.

  • Do not use Custom Javascript variables in GTM macros/variables as they are anonymous and a new copy of the functions are created in the memory on every event you trigger.

  • Of course, use History instead of page view to trigger page views as there are no refresh in single page applications.

Hope it helps some people facing the same problem

user_135794000
user_110471220
Related