monoceros
asked on
Preventing JS script element from hanging
Hi,
Recently hit an issue on a mobile e-commerce site where a very slow response from 3rd party site caused the execution of our JS to be delayed for long enough that the site appeared to be down (we load product information using JS/ajax).
The basic flow is:
in head we load our site JS
in the body we load a script for click tracking using (all identifying parameters removed to protect the 3rd party:
This then returns with further JS that includes
The issue is that http://tracking.company_Y.com/releases/collector.js was not responding in a timely manner and so the rest of the page JS execution is delayed and the site seemed to be down.
So we are looking to add some defensive programming into the site. I would like to wrap the outer script with some defensive programming.
Would something like (obviously without the alerts)
... be well supported across mobile browsers?
Is there a better way?
Recently hit an issue on a mobile e-commerce site where a very slow response from 3rd party site caused the execution of our JS to be delayed for long enough that the site appeared to be down (we load product information using JS/ajax).
The basic flow is:
in head we load our site JS
in the body we load a script for click tracking using (all identifying parameters removed to protect the 3rd party:
<script type='text/javascript'>
document.write('<script src="http://the.trackingcompany_X.com/x/y?"></script>');
</script>
This then returns with further JS that includes
var part_0 = '';part_0 += "<"+"script type=\"text/javascript\" src=\"http://tracking.company_Y.com/releases/collector.js\"><"+"/script>\n";part_0 += "<"+"script type=\"text/javascript\">\n";part_0 += "window.company_Y.collectorController.recordEngagementEvent(\'menu-xxxxx-page\', 0);\n";part_0 += "<"+"/script>\n";document.write(part_0);
The issue is that http://tracking.company_Y.com/releases/collector.js was not responding in a timely manner and so the rest of the page JS execution is delayed and the site seemed to be down.
So we are looking to add some defensive programming into the site. I would like to wrap the outer script with some defensive programming.
Would something like (obviously without the alerts)
<script type="text/javascript">
var jsLoaded = false;
setTimeout("callback()", 2000);
function callback() {
if (!jsLoaded) {
alert("Javascript not loaded after 2 seconds!");
} else {
alert('Loaded');
}
}
</script>
<script type="text/javascript" id="foo" src="url.js" onload="jsLoaded=true"></script>
... be well supported across mobile browsers?
Is there a better way?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER