Speed comparison of major jQuery versions

JavaScript performance comparison

Revision 5 of this test case created by MiChAeLoKGB

Preparation code

<div>
	<ul id="menu">
		<li class="menu-item">
		</li>
		<li class="menu-item">
		</li>
		<li class="menu-item">
		</li>
		<li class="menu-item">
		</li>
		<li class="menu-item">
		</li>
		<li class="menu-item">
		</li>
	</ul>
</div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
<script>
	var $jq160 = $.noConflict(true);
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script>
	var $jq170 = $.noConflict(true);
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script>
	var $jq180 = $.noConflict(true);
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
	var $jq191 = $.noConflict(true);
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
	var $jq200 = $.noConflict(true);
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script>
	var $jq224 = $.noConflict(true);
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<script>
	var $jq300 = $.noConflict(true);
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
	var $jq311 = $.noConflict(true);
</script>

<script>

	Benchmark.prototype.setup = function() {

		function tests($) {
			$('#menu').css({'backgroud': 'red'});
			$('.menu-item').eq(2).hasClass('foo');
			$('.menu-item:last-child').hide().show();
		}
	};

</script>
    

Preparation code output

<div> <ul id="menu"> <li class="menu-item"> </li> <li class="menu-item"> </li> <li class="menu-item"> </li> <li class="menu-item"> </li> <li class="menu-item"> </li> <li class="menu-item"> </li> </ul> </div> <script> var $jq160 = $.noConflict(true); </script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> <script> var $jq170 = $.noConflict(true); </script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script> <script> var $jq180 = $.noConflict(true); </script> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script> var $jq191 = $.noConflict(true); </script> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <script> var $jq200 = $.noConflict(true); </script> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <script> var $jq224 = $.noConflict(true); </script> <script src="//ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script> <script> var $jq300 = $.noConflict(true); </script> <script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script> var $jq311 = $.noConflict(true); </script> <script> Benchmark.prototype.setup = function() { function tests($) { $('#menu').css({'backgroud': 'red'}); $('.menu-item').eq(2).hasClass('foo'); $('.menu-item:last-child').hide().show(); } }; </script>

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in CCBot 2.0.0 / Other 0.0.0
Test Ops/sec

Revisions

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

0 Comments