Share:

RGraph: HTML5 canvas graph library - DOMContentLoaded example

Waiting for onload event...

These images are here to pad the page and slow down loading so that the window.onload event is slowed. This makes the difference far more visible.

The DOMContentLoaded event is an extremely useful event and can make a big impact on the performance of your pages, hence this example. The DOMContentLoaded event fires when the pages HTML and scripts have loaded, but not necessarily any images or CSS. This can make a big improvement on the apparent speed of your page(s).

You can read more about the DOMContentLoaded event on the Mozilla site, here, and the Microsoft site here.

function createGraph(func)
{
    if(window.addEventListener) {
        window.addEventListener('DOMContentLoaded', func, false);
    } else {
        document.attachEvent("onDOMContentLoaded", func);
    }
}

Browser support

The DOMContentLoaded event is supported by the following browsers:

• Google Chrome
• Mozilla Firefox
• Apple Safari
• Opera ASA. Opera
• Microsoft Internet Explorer 9

See also