Dynamic script with external src loading

Question 1

Sometimes I have issues while loading some ad scripts. If the external server is not responding, the whole page waits for the respond and stops loading. How can I tell those problem scripts to start executing after:

The whole page is loaded.
All other scripts are loaded.

Question 2

Using defer doesn't guarantee that it will defer both loading and running. You can control exact time when you want this script to start loading and executing by adding it to page dynamically by placing <script> with following contents after everything else you want to load and run:

var head=document.getElementsByTagName('head')[0]
var script=document.createElement('script')
script.setAttribute('type', 'text/javascript')
script.setAttribute('src', "http://your-script.com/address-here.js")
head.appendChild(script)

Question 3

When does it happen that defer doesn't defer?

Question 4

That looks like a solution. One more thing: how to set the script's content this way? Example: <script type="text/javascript" src="externalsite.com/script.js">var ad_id = '123abc';</script>

Question 5

Well, you always can .createTextNode and script.appendChild but even without looking in specs, I'm under impression that text child of script tag is silently ignored if you specify a src attribute.

Question 6

@Kos, directly from Sam's answer link: "The defer attribute gives a hint to the browser that the script does not create any content". Which is already seems like not exactly good thing. And then later: "In our tests IE4+ deferred the execution of deferred scripts, not their loading."

Question 7

Also, I've quickly refreshed myself on state of defer support in different browsers and it seems that so far not all of them exactly agree what (loading/run) is deferred, for how long and if it is guaranteed at all or not. So, manual control really seems to be better solution.

Question 8

Use the DEFER attribute of javascript declaration:

<script src="script.js" type="text/javascript" defer="defer"></script>

Question 9

You need to defer your script. This will allow this rest of the page to load whilst this script is downloading.

Here is how to do it:

<script src="yourscript.js" defer="defer" type="text/javascript"></script>

More reading - http://www.websiteoptimization.com/speed/tweak/defer/

Oleg V. Volkov 22.6k4 gold badges49 silver badges68 bronze badges · Accepted Answer · 2012-05-30 12:56:07Z

1

Using defer doesn't guarantee that it will defer both loading and running. You can control exact time when you want this script to start loading and executing by adding it to page dynamically by placing <script> with following contents after everything else you want to load and run:

var head=document.getElementsByTagName('head')[0]
var script=document.createElement('script')
script.setAttribute('type', 'text/javascript')
script.setAttribute('src', "http://your-script.com/address-here.js")
head.appendChild(script)

Share

Improve this answer

edited May 30, 2012 at 13:54

answered May 30, 2012 at 12:56

Oleg V. Volkov's user avatar

Oleg V. Volkov

22.6k4 gold badges49 silver badges68 bronze badges

Sign up to request clarification or add additional context in comments.

14 Comments

Kos

Kos Over a year ago

When does it happen that defer doesn't defer?

2012年05月30日T13:01:26.553Z+00:00

abr

abr Over a year ago

That looks like a solution. One more thing: how to set the script's content this way? Example: <script type="text/javascript" src="externalsite.com/script.js">var ad_id = '123abc';</script>

2012年05月30日T13:03:55.187Z+00:00

Oleg V. Volkov

Oleg V. Volkov Over a year ago

Well, you always can .createTextNode and script.appendChild but even without looking in specs, I'm under impression that text child of script tag is silently ignored if you specify a src attribute.

2012年05月30日T13:23:17.86Z+00:00

Oleg V. Volkov

Oleg V. Volkov Over a year ago

@Kos, directly from Sam's answer link: "The defer attribute gives a hint to the browser that the script does not create any content". Which is already seems like not exactly good thing. And then later: "In our tests IE4+ deferred the execution of deferred scripts, not their loading."

2012年05月30日T13:26:03.46Z+00:00

Oleg V. Volkov

Oleg V. Volkov Over a year ago

Also, I've quickly refreshed myself on state of defer support in different browsers and it seems that so far not all of them exactly agree what (loading/run) is deferred, for how long and if it is guaranteed at all or not. So, manual control really seems to be better solution.

2012年05月30日T13:30:02.09Z+00:00

|

CollectivesTM on Stack Overflow

Dynamic script with external src loading

3 Answers 3

14 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Hot Network Questions

CollectivesTM on Stack Overflow

3 Answers 3

14 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Related