Checking document.ready and document.load events in Chrome developer tools

In Chrome developer tools, using the Network tab, you can easily see when the document.ready() and document.load() events fire.

If you open up the Network tab and refresh the page, you'll see several assets loading up.

The vertical blue line indicates that the document.ready() event has fired. This happens once the DOM has been fully parsed.

The vertical red line indicates that the document.load() event has fired. This happens when all of the document's assets have been downloaded and the screen has been painted with them.