When a webpage loads, it fetches the stylesheets, javascript, images, other objects etc. So, when it is done, it's already late and user may complain about the site's poor speed of execution. One way you can make it faster, you can start JavaScript execution immediately right after the HTML DOM has finished loading and ready to traverse, before the images.
// Introduce our custom event onDOMReady
window.onDOMReady = DOMReady
function DOMReady(fn)
{
// According to standard implementation
if(document.addEventListener)
document.addEventListener("DOMContentLoaded", fn, false);
// IE
else
document.onreadystatechange = function()
{
checkReadyState(fn);
}
}
function checkReadyState(fn)
{
if(document.readyState == "interactive")
fn();
}
window.onDOMReady(
function()
{
// DOM is loaded
// So start JavaScript execution
}
);