jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.
jsperf.com URLs are mirrored at the same path, e.g:
https://jsperf.com/negative-modulo/2
Can be accessed at:
https://jsperf.app/negative-modulo/2
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<link href='assets/css/reset.css' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet'
type='text/css'>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript">
</script>
<script src="assets/js/jquery.navbar.js" type="text/javascript">
</script>
<link href='assets/css/widget.page-navigation.css' rel='stylesheet' type='text/css'>
<style type="text/css">
body { margin-top:100px;background:url('assets/css/background.gif') repeat; font-family:
"Droid Sans", "Arial", "Helvetica", "Lucida Grande", "Verdana", "Gill Sans", sans-serif;font-size:14px;
line-height:1.25;} #wrapper { width:100%; margin:0 auto; } /* set up nav bar */ #nav
{ border: 1px solid #000; list-style: none; margin: 0; height: 24px; text-align:
center; font-size: 13px; background-color: #858585; background-image: -webkit-gradient(linear,
left top, left bottom, from(#858585), to(#323232)); background-image: -webkit-linear-gradient(top,
#858585, #323232); background-image: -moz-linear-gradient(top, #858585, #323232);
background-image: -ms-linear-gradient(top, #858585, #323232); background-image: -o-linear-gradient(top,
#858585, #323232); background-image: linear-gradient(top, #858585, #323232); filter:
progid:DXImageTransform.Microsoft.gradient(startColorStr='#858585', EndColorStr='#323232');
-webkit-text-shadow: 0 -1px 1px #000; -moz-text-shadow: 0 -1px 1px #000; -o-text-shadow:
0 -1px 1px #000; text-shadow: 0 -1px 1px #000; -webkit-box-shadow: 0 0 1px #fff;
-moz-box-shadow: 0 0 1px #fff; -o-box-shadow: 0 0 1px #fff; box-shadow: 0 0 1px #fff;
-webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; -o-background-size:
100% 100%; background-size: 100% 100%; } /* Item formatting */ #nav li { display:
inline; position: relative; } #nav a { color: #fff; display: inline-block; padding:4px
0; text-decoration: none; width: 162px; } /* Drop Down Menu */ #nav ul { background-color:
#fff; border-radius: 3px; left: 0; margin: 0; opacity:0; overflow: hidden; padding:
2px; position: absolute; text-align: left; top: 125%; visibility: hidden; width:
162px; -webkit-text-shadow: none; -moz-text-shadow: none; -o-text-shadow: none; text-shadow:
none; -webkit-box-shadow: 0 0 2px #000; -moz-box-shadow: 0 0 2px #000; -o-box-shadow:
0 0 2px #000; box-shadow: 0 0 2px #000; } /* Main level nav hover formatting */ #nav
a:hover { background-color: #858585; background-image: -webkit-gradient(linear, left
top, left bottom, from(#323232), to(#858585)); background-image: -webkit-linear-gradient(top,
#323232, #858585); background-image: -moz-linear-gradient(top, #323232, #858585);
background-image: -ms-linear-gradient(top, #323232, #858585); background-image: -o-linear-gradient(top,
#323232, #858585); background-image: linear-gradient(top, #323232, #858585); filter:
progid:DXImageTransform.Microsoft.gradient(startColorStr='#858585', EndColorStr='#323232');
} /* Sub-menu */ #nav ul li { display: block; text-align: left; } /* Show sub menu
*/ #nav li:hover ul { opacity:1; visibility: visible; -webkit-transition: all 400ms
ease 0s; -moz-transition: all 400ms ease 0s; -o-transition: all 400ms ease 0s; transition:
all 400ms ease 0s; } /* Keep hover state on parent(top-level) LI */ #nav li:hover
a{ background-color: #858585; background-image: -webkit-gradient(linear, left top,
left bottom, from(#323232), to(#858585)); background-image: -webkit-linear-gradient(top,
#323232, #858585); background-image: -moz-linear-gradient(top, #323232, #858585);
background-image: -ms-linear-gradient(top, #323232, #858585); background-image: -o-linear-gradient(top,
#323232, #858585); background-image: linear-gradient(top, #323232, #858585); filter:
progid:DXImageTransform.Microsoft.gradient(startColorStr='#858585', EndColorStr='#323232');}
/* base formatting for sub menu anchors */ #nav ul a { background: #fff; border:1px
solid #FFF; border-radius: 2px; color: #646464; display: block; text-indent:2px;
width: 160px; } #nav li:hover ul a { background: none; border: 1px solid #fff; }
#nav li:hover ul a:hover { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAKElEQVQIW2N88unXfwYokOZlZWCECYA4Tz//hgjAOCCFjP+BACQDAwBFeRhufnvW/gAAAABJRU5ErkJggg==)
0 0 repeat; border: 1px solid #a9d5ef; } .more { clip: rect(0 16px 14px 0); top:0;
margin:1px 0 0 3px; position :absolute; } #nav .active, #nav .active:hover, #nav
li:hover a.active { border-bottom: 1px solid #ffffff; border-right: 1px solid #000;
border-left: 1px solid #000; color: #626262; width: 160px; background-image: -webkit-gradient(linear,
left top, left bottom, from(#ff871a), to(#ffd778)); background-image: -webkit-linear-gradient(top,
#ff871a, #ffd778); background-image: -moz-linear-gradient(top, #ff871a, #ffd778);
background-image: -ms-linear-gradient(top, #ff871a, #ffd778); background-image: -o-linear-gradient(top,
#ff871a, #ffd778); background-image: linear-gradient(top, #ff871a, #ffd778); filter:
progid:DXImageTransform.Microsoft.gradient(startColorStr='#858585', EndColorStr='#323232');
/*text-shadow:0 1px 0 #ffdca3;*/ -webkit-text-shadow: 0 1px 0 rgba(255,255,255,0.5);
-moz-text-shadow: 0 1px 0 rgba(255,255,255,0.5); -o-text-shadow: 0 1px 0 rgba(255,255,255,0.5);
text-shadow: 0 1px 0 rgba(255,255,255,0.5); -webkit-box-shadow: inset 0 0 2px rgba(154,84,1,.9);
-moz-box-shadow: inset 0 0 2px rgba(154,84,1,.9); -o-box-shadow: inset 0 0 2px rgba(154,84,1,.9);
box-shadow: inset 0 0 1px rgba(154,84,1,.9); } a.active .more { clip:rect(14px 16px
32px 0); margin:1px 0 0 3px; position:absolute; top:-14px; }
</style>
<script type="text/javascript">
$(function() {
$('#nav li:has(ul) a:not(#nav ul li a)').addClass("hasMore").append('<img src="assets/img/drop-down-arrow-sprite.png" class="more" />');
});
$(function() {
$("#nav").navBar();
});
</script>
</head>
<body>
<div id="wrapper">
<div id="header">
<ul id="nav">
<li>
<a href="#" class="active">Administration</a>
<ul>
<li>
<a href="#">Manage Program Documents</a>
</li>
<li>
<a href="#">One - b</a>
</li>
<li>
<a href="#">One - c</a>
</li>
<li>
<a href="#">One - d</a>
</li>
</ul>
</li>
<li>
<a href="#">Documents</a>
</li>
<li>
<a href="#">Compliance</a>
<li>
<a href="#">Workflow</a>
<ul>
<li>
<a href="#">Sub One - a</a>
</li>
<li>
<a href="#">Sub One - b</a>
</li>
<li>
<a href="#">Sub One - c</a>
</li>
<li>
<a href="#">Sub One - d</a>
</li>
</ul>
</li>
<li>
<a href="#">Communication</a>
</li>
<li>
<a href="#">Program</a>
</li>
</ul>
</div>
</div>
<script>
$(function() {
$("#nav").navBar();
});
</script>Ready to run.
| Test | Ops/sec | |
|---|---|---|
| setactive has/not | | ready |
| setactive | | ready |
You can edit these tests or add more tests to this page by appending /edit to the URL.