jQuery ready vs DOMContentLoaded

Benchmark created by sugarshin on


Preparation HTML

<div id="t">
<p>
<a href="#">てすと</a>
</p>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Test runner

Ready to run.

Testing in
TestOps/sec
DOMContentLoaded
	function domContentLoaded() {
  $('#t').find('p').find('a').text('change!!');
		alert('DOMContentLoaded');
	}
	
	if(document.addEventListener){
		document.addEventListener('DOMContentLoaded', domContentLoaded);
	} else if(/msie/.test(navigator.userAgent.toLowerCase())){
		try {
			document.documentElement.doScroll("left");
		} catch(error){
			setTimeout(arguments.callee, 0);
			return;
		}
		domContentLoaded();
	}
ready
jQuery ready
	function domContentLoaded() {
  $('#t').find('p').find('a').text('change!!');
		alert('DOMContentLoaded');
	}
	
  $(function(){
    domContentLoaded();
  });
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.