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
Which one is faster?
<div id="thing">
<div>
<div class="weeks"></div>
</div>
<div>
<div class="days"></div>
</div>
<div>
<div class="hours"></div>
</div>
<div>
<div class="minutes"></div>
</div>
<div>
<div class="seconds"></div>
</div>
</div>
// Shared
const MS_IN_SECOND = 1000;
const MS_IN_MINUTE = MS_IN_SECOND * 60;
const MS_IN_HOUR = MS_IN_MINUTE * 60;
const MS_IN_DAY = MS_IN_HOUR * 24;
const MS_IN_WEEK = MS_IN_DAY * 7;
const rContainer = document.getElementById("thing");
const rWeeks = rContainer.querySelector(".weeks");
const rDays = rContainer.querySelector(".days");
const rHours = rContainer.querySelector(".hours");
const rMinutes = rContainer.querySelector(".minutes");
const rSeconds = rContainer.querySelector(".seconds");
function getParts() {
const now = Date.now()
const remaining = Math.max(1735689600000 - now, 0);
const weeks = Math.floor(remaining / MS_IN_WEEK);
const days = Math.floor((remaining % MS_IN_WEEK) / MS_IN_DAY);
const hours = Math.floor((remaining % MS_IN_DAY) / MS_IN_HOUR);
const minutes = Math.floor((remaining % MS_IN_HOUR) / MS_IN_MINUTE);
const seconds = Math.ceil((remaining % MS_IN_MINUTE) / MS_IN_SECOND);
return {
weeks,
days,
hours,
minutes,
seconds
}
}
function collapseIfLessThan1(value, element) {
const parent = element.parentElement;
if (value > 0) {
element.textContent = value;
parent.style.display = "";
return;
}
element.textContent = "-";
parent.style.display = "none"
}
function newSegmentIfNeeded(value, name, targets) {
const parentElement = newSegmentIfNeededCore(value, name);
targets.push(parentElement);
}
function newSegmentIfNeededCore(value, name) {
if (value < 1) {
return null;
}
const valueElement = document.createElement("div");
valueElement.className = name;
valueElement.textContent = value;
const parentElement = document.createElement("div");
parentElement.appendChild(valueElement);
return parentElement;
}
function newSegmentIfNeededAppend(value, name, container) {
const parentElement = newSegmentIfNeededCore(value, name);
if (!parentElement) {
return;
}
container.appendChild(parentElement);
}
Ready to run.
Test | Ops/sec | |
---|---|---|
Reuse elements / collapse if not needed |
| ready |
replaceChildren |
| ready |
Empty, append |
| ready |
Empty, append as discovered |
| ready |
You can edit these tests or add more tests to this page by appending /edit to the URL.