⚡️Conditional loading of large Javascript files

You may sometimes find yourself with big Javascript libraries to include in your documents. Currently I am on a project where one of them is about 1MB big (don’t ask).
Now, I wondered what can be done to only apply these when they are really needed, and the answer, aside from adding an extra page to the process is to add them dynamically via the DOM:

window.onload=function(){

if(!document.getElementById || !document.createElement){return;}

var newjs=document.createElement(‘script’);

newjs.type=’text/javascript’;

newjs.src=’functions.js’;

document.getElementsByTagName(‘head’)[0].appendChild(newjs);

}

	

This example would only load the file “functions.js” when DOM is available in the browser, older browsers would not load the file.