shogun70/gist:5388420

## gistfile1.html
<!DOCTYPE html>
<script type="text/javascript">
var addEvent = document.addEventListener ?
function(node, name, fn) { node.addEventListener(name, fn, false); } :
function(node, name, fn) { node.attachEvent('on' + name, fn); }

var begin = +new Date;
var log = [];
log.push('Event, Time: readyState, EOF');
function logEvent(name) {
  var now = +new Date;
	var eof = !!document.getElementById("end");
	log.push(name + ', ' + (now - begin) + ': ' + document.readyState + ', ' + (eof ? 'true' : 'false'));
}
function addEventLogger(node, name) {
	addEvent(node, name, function() { logEvent(name); });
}

logEvent('start');
addEventLogger(document, 'readystatechange');
addEventLogger(document, 'DOMContentLoaded');
addEventLogger(window, 'load');

addEvent(window, 'load', function() {
	window.setTimeout(function() { alert(log.join('\n')); }, 100);
});
</script>
<!DOCTYPE HTML>
<html lang="en">
<head>
    <title>DOM Ready Test</title>
</head>
<body id="body">
<div id="start">Start-of-file</div>

<div>
This page logs events and parsing progress points related to <code>document.readyState</code>.<br />
The following information is logged:
<dl>
	<dt>Event</dt>
	<dd>The event-name or a position in the page markup</dd>

	<dt>Time</dt>
	<dd>The elapsed time (ms) since parsing the page began</dd>

	<dt>readyState</dt>
	<dd>The <code>document.readyState</code>. </dd>

	<dt>EOF</dt>
	<dd>End-of-file. Has the end of the markup been parsed?</dd>

</dl>

Parsing is paused using an alert. A <i>sleep</i> event occurs before this and a <i>wake</i> event immediately after. <br />

There is also <i>start</i> and <i>end</i> events, plus the real browser events <code>readystatechange</code>, <code>DOMContentLoaded</code> and <code>load</code>. <br />

The results are shown in An alert after the page is loaded. <br />

IE, in particular, exhibits different behavior between the initial page-load and a page refresh.

</div>
<div>Pausing...</div>
<script>
logEvent('sleep');
</script>
<script>
alert('Pausing the parser');
</script>
<script>
logEvent('wake');
</script>
<div id="end">End-of-file</div>
</body>
</html>
<script>
logEvent('end');
</script>
	<!DOCTYPE html>
	<script type="text/javascript">
	var addEvent = document.addEventListener ?
	function(node, name, fn) { node.addEventListener(name, fn, false); } :
	function(node, name, fn) { node.attachEvent('on' + name, fn); }

	var begin = +new Date;
	var log = [];
	log.push('Event, Time: readyState, EOF');
	function logEvent(name) {
	var now = +new Date;
	var eof = !!document.getElementById("end");
	log.push(name + ', ' + (now - begin) + ': ' + document.readyState + ', ' + (eof ? 'true' : 'false'));
	}
	function addEventLogger(node, name) {
	addEvent(node, name, function() { logEvent(name); });
	}

	logEvent('start');
	addEventLogger(document, 'readystatechange');
	addEventLogger(document, 'DOMContentLoaded');
	addEventLogger(window, 'load');

	addEvent(window, 'load', function() {
	window.setTimeout(function() { alert(log.join('\n')); }, 100);
	});
	</script>
	<!DOCTYPE HTML>
	<html lang="en">
	<head>
	<title>DOM Ready Test</title>
	</head>
	<body id="body">
	<div id="start">Start-of-file</div>

	<div>
	This page logs events and parsing progress points related to <code>document.readyState</code>.<br />
	The following information is logged:
	<dl>
	<dt>Event</dt>
	<dd>The event-name or a position in the page markup</dd>

	<dt>Time</dt>
	<dd>The elapsed time (ms) since parsing the page began</dd>

	<dt>readyState</dt>
	<dd>The <code>document.readyState</code>. </dd>

	<dt>EOF</dt>
	<dd>End-of-file. Has the end of the markup been parsed?</dd>

	</dl>

	Parsing is paused using an alert. A <i>sleep</i> event occurs before this and a <i>wake</i> event immediately after. <br />

	There is also <i>start</i> and <i>end</i> events, plus the real browser events <code>readystatechange</code>, <code>DOMContentLoaded</code> and <code>load</code>. <br />

	The results are shown in An alert after the page is loaded. <br />

	IE, in particular, exhibits different behavior between the initial page-load and a page refresh.

	</div>
	<div>Pausing...</div>
	<script>
	logEvent('sleep');
	</script>
	<script>
	alert('Pausing the parser');
	</script>
	<script>
	logEvent('wake');
	</script>
	<div id="end">End-of-file</div>
	</body>
	</html>
	<script>
	logEvent('end');
	</script>