title: Loading JavaScript asynchronously and coupling with inline code
body: <p>The combination of "Degrading Script Tags" <a href="http://ejohn.org/blog/degrading-script-tags/" rel="nofollow">http://ejohn.org/blog/degrading-script-tags/</a> and Script DOM Element is a nice pattern for loading external JavaScript asynchronously and coupling with inline code.</p>
  
  <p>Steve Souders describes the combination nicely in this article: <a href="http://www.stevesouders.com/blog/2008/12/27/coupling-async-scripts/" rel="nofollow">http://www.stevesouders.com/blog/2008/12/27/coupling-async-scripts/</a></p>
  
  <p>Basically the script on a page is triggered by the external script once that external script has loaded. I had been wondering what would happen if the script that is run when the external script has downloaded tried to add event handlers. The DOM might not be finished loading and therefore the addition of an event handler might fail.</p>
  
  <p>However, Steve Souders article is very thorough and even goes on to discuss Lazy Loading. That means the external script is not downloaded until the page has loaded (as the script element that is added to the DOM is done so inside window.onload). That ensures that the addition of event handlers should work.</p>
  
  <p>So all might seem well, but I'm left with a niggling problem - given we have waited for the page to be loaded, the user could interact with the page and perhaps even leave the page before the event handlers have been added.</p>
  
  <p>Is my niggle a valid concern? And if so, is there a robust way to resolve it?</p>
  
  <p>Thanks,
  Paul</p>