I’m having issues with my website where tracking tools are slowing down my main JavaScript code. I have both Google Analytics and HubSpot installed on my pages and they seem to interfere with my custom scripts.
My setup uses jQuery with the document ready function to wait for the DOM to load before running my code. However, the analytics libraries are still causing delays and making my site feel sluggish.
Is there a way to postpone loading these tracking scripts until after my main JavaScript has finished executing? I want my core functionality to run smoothly without being blocked by third-party analytics code.
Any suggestions on how to control the loading order would be helpful.
Timeouts work but you’ll end up with a mess of manual script management.
I’ve dealt with this headache tons of times. The real problem is trying to orchestrate everything manually when you could just automate it.
Now I set up automated workflows that handle script loading based on performance triggers. Monitor when your core JavaScript finishes, then fire off analytics scripts automatically.
Skip hardcoded delays and unreliable requestIdleCallback. Build a smart system that watches for jQuery completion and triggers tracking scripts in whatever order you need.
I use Latenode because it builds workflows that monitor actual page performance and trigger scripts based on real completion events instead of random timeouts. Way better than guessing with setTimeout.
Set it up to wait for specific DOM events, monitor script status, then fire analytics in sequence. No more timing guesswork.
I’ve been fighting this same issue on multiple client projects. Here’s what actually worked: wrap your main jQuery code in a promise that resolves when the critical stuff finishes, then chain the analytics loading after that promise resolves. The game-changer was moving the actual script tags, not just delaying execution. I physically moved the Google Analytics and HubSpot script tags to load after my main scripts finish instead of trying to control when they run. This stops them from even downloading until your core functionality’s ready. Also switched to the newer gtag implementation for GA - it handles async way better than the old analytics.js. Made a huge difference on mobile.
I faced similar challenges with third-party scripts impacting my site’s speed. One effective solution I implemented was to defer loading the analytics scripts. I encapsulated all the tracking calls in a dedicated function and used window.addEventListener(‘load’, function() { setTimeout(loadAnalytics, 100); }) to ensure the analytics code runs after my main JavaScript finishes. Additionally, consider utilizing the requestIdleCallback API, which executes the analytics code only when the browser is idle, preventing disruption to your core functionalities.