[whatwg] Deferring javascript download and execution until after onload

The script defer attribute allows us to defer JS until after
DOMContentLoaded (?) but it will still execute before onLoad

Sometimes there's a quite a bit of content on a page that could be
deferred until after onLoad, for example suplemental content such as
social media buttons, feedback forms etc. where they really don't make
much sense until the page hase loaded.

Currently patterns like the code below are being used to implement
this type of behaviour but has any thought been given to being able to
specify as part of the script element that the script could be
deferred until after onLoad?

<script>
(function(w, d, s) {
  function go(){
    var js, fjs = d.getElementsByTagName(s)[0], load = function(url, id) {
	  if (d.getElementById(id)) {return;}
	  js = d.createElement(s); js.src = url; js.id = id;
	  fjs.parentNode.insertBefore(js, fjs);
	};
    load('//connect.facebook.net/en_US/all.js#appId=272697932759946&xfbml=1',
'fbjssdk');
    load('https://apis.google.com/js/plusone.js', 'gplus1js');
    load('//platform.twitter.com/widgets.js', 'tweetjs');
  }
  if (w.addEventListener) { w.addEventListener("load", go, false); }
  else if (w.attachEvent) { w.attachEvent("onload",go); }
}(window, document, 'script'));
</script>

Script was borrowed from
http://www.aaronpeters.nl/blog/why-loading-third-party-scripts-async-is-not-good-enough

Thanks

Andy

Received on Monday, 17 September 2012 11:20:19 UTC