document.on vs element.on
JavaScript performance comparison
Preparation code
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<div id="page">
<div class="container">
<div class="box">
<div class="test-box">
<a href="#" class="link">Test</a>
</div>
</div>
</div>
</div>
<div id="page">
<div class="container">
<div class="box">
<div class="test-box">
<a href="#" class="link">Test</a>
</div>
</div>
</div>
</div>
<div id="page">
<div class="container">
<div class="box">
<div class="test-box">
<a href="#" class="link">Test</a>
</div>
</div>
</div>
</div>
<div id="page">
<div class="container">
<div class="box">
<div class="test-box">
<a href="#" class="link">Test</a>
</div>
</div>
</div>
</div>
<div id="page">
<div class="container">
<div class="box">
<div class="test-box">
<a href="#" class="link">Test</a>
</div>
</div>
</div>
</div>
<div id="page">
<div class="container">
<div class="box">
<div class="test-box">
<a href="#" class="link">Test</a>
</div>
</div>
</div>
</div>
<div id="page">
<div class="container">
<div class="box">
<div class="test-box">
<a href="#" class="link">Test</a>
</div>
</div>
</div>
</div>
<div id="page">
<div class="container">
<div class="box">
<div class="test-box">
<a href="#" class="link">Test</a>
</div>
</div>
</div>
</div>
<div id="page">
<div class="container">
<div class="box">
<div class="test-box">
<a href="#" class="link">Test</a>
</div>
</div>
</div>
</div>
<div id="page">
<div class="container">
<div class="box">
<div class="test-box">
<a href="#" class="link">Test</a>
</div>
</div>
</div>
</div>
<script>
Benchmark.prototype.setup = function() {
var $doc = $(document);
};
</script>
Preparation code output
Test runner
Warning! For accurate results, please disable Firebug before running the tests. (Why?)
Java applet disabled.
| Test | Ops/sec | |
|---|---|---|
document.on |
|
pending… |
element.on |
|
pending… |
cached document |
|
pending… |
You can edit these tests or add even more tests to this page by appending /edit to the URL.
0 comments