JavaScript async script is blocking

Question

I've been having trouble loading connect.facebook.net/en_GB/all.js. I'm not sure if it's happening to anyone else, but this script takes forever to load (sometimes doesn't load). It doesn't even timeout. I have a PHP script which loads a few scripts asynchronously as shown below. Even after doing this, the problem persists. document.readyState remains as "interactive" as long as the script is loading, so my domcontentloaded event never fires.

This problem occurs randomly on different sites, computers and browsers that I have tried in the past few days.

<script>(function(d, s, f){
    var a = d.getElementsByTagName(s)[0], i = f.length;
    while (i--) {
        j = d.createElement(s);
        j.src = f[i];
        j.async = true;
        a.parentNode.insertBefore(j, a);
    }
}(document, 'script', ['//connect.facebook.net/en_GB/all.js', '//platform.twitter.com/widgets.js', '//www.google-analytics.com/ga.js']));</script>

This is the resulting script tag:

<script src="//connect.facebook.net/en_GB/all.js" async=""></script>

score 0 · Answer 1 · answered Jun 21 '13 at 05:27

Since I haven't had any response for a while, I'll just say what I did. I still couldn't solve the problem but I had a workaround. Rather than loading the script immediately, I loaded it after the DOM loaded. My DOMContentLoaded would fire but onload still wouldn't fire.

JavaScript async script is blocking

1 Answers1