Is there a way to include a javascript-loaded advertisement last on the page, but have it positioned in the content? The primary purpose is to keep the javascript ad from slowing down the page load, so if there are other methods to achieve this please do share.
Is there a way to include a javascript-loaded advertisement last on the page, but have it positioned in the content? The primary purpose is to keep the javascript ad from slowing down the page load, so if there are other methods to achieve this please do share.
Share Improve this question edited Apr 4, 2015 at 19:43 niton 9,17923 gold badges35 silver badges56 bronze badges asked Jan 18, 2009 at 2:38 britgbritg 2252 silver badges8 bronze badges3 Answers
Reset to default 10There is the defer attribute you could put on script blocks to defer its execution until the page pletes loading.
<script src="myscript.js" type="text/javascript" defer>
// blah blah
</script>
I am not sure about the general remendation about using this attribute though.
EDIT: As @David pointed out, use defer="defer" for XHTML
And you can always put the code inside the window.onload event so that it executes after the pages load:
window.onload = function () {
// ad codes here
};
But the later approach may pose some problems, you might want to test it out first.
More information on this blog post by Dean Edwards, the guy who wrote the famous javascript packer.
EDIT: If the size of ad code itself is the problem, you can always defer the loading by bining the above methods with script injection via document.write:
function loadScript(src) {
document.write('<script src="' + src + '" type="text/javascript"></script>');
}
So the resulting code might look something like this:
<script type="text/javascript" defer>
function loadScript(src) {
document.write('<script src="' + src + '" type="text/javascript"></script>');
}
loadScript('http://ads.example./advertisements.js');
</script>
But as I've said, it depends on the specific ad code you get too. Because of the position document.write will write stuffs to might not be the location you want. Some modifications might be neccessary.
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
oldonload();
func();
}
}
}
The above code is a nice way to add a new onload event that doesn't interfere with your existing javascript. Then you can add a new load event to load the advertisements using the code below.
addLoadEvent(function() { // call to loadScript() here });
I usually put the tag to load script just before the end of body tag. So it loads at the end of the page. This does not give any validation errors or whatsoever.