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
<div
class="monaco-editor no-user-select showUnused showDeprecated vs"
role="code"
data-uri="inmemory://model/2"
style="width: 949px; height: 30px"
>
<div data-mprt="3" class="overflow-guard" style="width: 949px; height: 30px">
<div
class="margin"
role="presentation"
aria-hidden="true"
style="
position: absolute;
transform: translate3d(0px, 0px, 0px);
contain: strict;
top: 0px;
height: 30px;
width: 72px;
"
>
<div
class="glyph-margin"
style="left: 0px; width: 0px; height: 30px"
></div>
<div
class="margin-view-zones"
role="presentation"
aria-hidden="true"
style="position: absolute"
></div>
<div
class="margin-view-overlays"
role="presentation"
aria-hidden="true"
style="
position: absolute;
font-family: Menlo, Consolas, monospace, sans-serif, Consolas,
'Courier New', monospace;
font-weight: normal;
font-size: 14px;
font-feature-settings: 'liga' 0, 'calt' 0;
font-variation-settings: normal;
line-height: 19px;
letter-spacing: 0px;
width: 72px;
height: 30px;
"
>
<div style="top: 5px; height: 19px">
<div class="current-line" style="width: 72px"></div>
</div>
</div>
<div
class="glyph-margin-widgets"
style="position: absolute; top: 0px"
></div>
</div>
<div
class="monaco-scrollable-element editor-scrollable vs"
role="presentation"
data-mprt="6"
style="
position: absolute;
overflow: hidden;
left: 72px;
height: 30px;
width: 877px;
"
>
<div
class="lines-content monaco-editor-background"
style="
position: absolute;
overflow: hidden;
width: 1.67772e7px;
height: 1.67772e7px;
transform: translate3d(0px, 0px, 0px);
contain: strict;
top: 0px;
left: 0px;
"
>
<div
class="view-overlays"
role="presentation"
aria-hidden="true"
style="
position: absolute;
font-family: Menlo, Consolas, monospace, sans-serif, Consolas,
'Courier New', monospace;
font-weight: normal;
font-size: 14px;
font-feature-settings: 'liga' 0, 'calt' 0;
font-variation-settings: normal;
line-height: 19px;
letter-spacing: 0px;
height: 0px;
width: 877px;
"
>
<div style="top: 5px; height: 19px">
<div
class="cdr squiggly-error"
style="left: 38px; width: 15px"
></div>
</div>
</div>
<div role="presentation" aria-hidden="true" class="view-rulers"></div>
<div
class="view-zones"
role="presentation"
aria-hidden="true"
style="position: absolute"
></div>
<div
class="view-lines monaco-mouse-cursor-text"
role="presentation"
aria-hidden="true"
data-mprt="8"
style="
position: absolute;
font-family: Menlo, Consolas, monospace, sans-serif, Consolas,
'Courier New', monospace;
font-weight: normal;
font-size: 14px;
font-feature-settings: 'liga' 0, 'calt' 0;
font-variation-settings: normal;
line-height: 19px;
letter-spacing: 0px;
width: 877px;
height: 30px;
"
>
<div style="top: 5px; height: 19px" class="view-line">
<span
><span class="mtk19">Search</span
><span class="mtk9">(</span></span
>
</div>
</div>
<div
data-mprt="1"
class="contentWidgets"
style="position: absolute; top: 0px"
>
<div
class="lightBulbWidget"
role="listbox"
widgetid="LightBulbWidget"
style="
position: absolute;
display: none;
visibility: hidden;
max-width: 877px;
"
></div>
</div>
<div
role="presentation"
aria-hidden="true"
class="cursors-layer cursor-line-style cursor-solid"
>
<div
class="cursor monaco-mouse-cursor-text"
style="
height: 19px;
top: 5px;
left: 53px;
font-family: Menlo, Consolas, monospace, sans-serif, Consolas,
'Courier New', monospace;
font-weight: normal;
font-size: 14px;
font-feature-settings: 'liga' 0, 'calt' 0;
font-variation-settings: normal;
line-height: 19px;
letter-spacing: 0px;
display: block;
visibility: hidden;
padding-left: 1px;
width: 2px;
"
></div>
</div>
</div>
<div
role="presentation"
aria-hidden="true"
class="invisible scrollbar horizontal"
style="
position: absolute;
width: 869px;
height: 8px;
left: 0px;
bottom: 0px;
"
>
<div
class="slider"
style="
position: absolute;
top: 0px;
left: 0px;
height: 8px;
transform: translate3d(0px, 0px, 0px);
contain: strict;
width: 869px;
"
></div>
</div>
<canvas
class="decorationsOverviewRuler"
aria-hidden="true"
width="0"
height="0"
style="
position: absolute;
transform: translate3d(0px, 0px, 0px);
contain: strict;
top: 0px;
right: 0px;
width: 8px;
height: 30px;
display: none;
"
></canvas>
<div
role="presentation"
aria-hidden="true"
class="invisible scrollbar vertical"
style="
position: absolute;
width: 8px;
height: 30px;
right: 0px;
top: 0px;
"
>
<div
class="slider"
style="
position: absolute;
top: 0px;
left: 0px;
width: 8px;
transform: translate3d(0px, 0px, 0px);
contain: strict;
height: 30px;
"
></div>
</div>
</div>
<div role="presentation" aria-hidden="true" style="width: 949px"></div>
<textarea
data-mprt="7"
class="inputarea monaco-mouse-cursor-text"
wrap="on"
autocorrect="off"
autocapitalize="off"
autocomplete="off"
spellcheck="false"
aria-label="Editor content;Press Alt+F1 for Accessibility Options."
aria-required="false"
tabindex="0"
role="textbox"
aria-roledescription="editor"
aria-multiline="true"
aria-autocomplete="both"
style="
tab-size: 30.7969px;
font-family: Menlo, Consolas, monospace, sans-serif, Consolas,
'Courier New', monospace;
font-weight: normal;
font-size: 14px;
font-feature-settings: 'liga' 0, 'calt' 0;
font-variation-settings: normal;
line-height: 19px;
letter-spacing: 0px;
top: 5px;
left: 72px;
width: 862px;
height: 1px;
"
aria-haspopup="false"
></textarea>
<div
class="monaco-editor-background textAreaCover"
style="position: absolute; top: 0px; left: 0px; width: 0px; height: 0px"
></div>
<div data-mprt="4" class="overlayWidgets" style="width: 949px">
<div
class="sticky-widget"
widgetid="editor.contrib.stickyScrollWidget"
style="
width: 941px;
position: absolute;
right: 50%;
top: 0px;
display: none;
"
>
<div
class="sticky-widget-line-numbers"
role="none"
style="width: 72px"
></div>
<div
class="sticky-widget-lines-scrollable"
style="--vscode-editorStickyScroll-scrollableWidth: 869px"
>
<div class="sticky-widget-lines" role="list" style="left: 0px"></div>
</div>
</div>
<div
class="monaco-hover hidden"
tabindex="0"
role="tooltip"
widgetid="editor.contrib.modesGlyphHoverWidget"
style="position: absolute"
>
<div
class="monaco-scrollable-element"
role="presentation"
style="position: relative; overflow: hidden"
>
<div class="monaco-hover-content" style="overflow: hidden"></div>
<div
role="presentation"
aria-hidden="true"
class="invisible scrollbar horizontal"
style="position: absolute"
>
<div
class="slider"
style="
position: absolute;
top: 0px;
left: 0px;
height: 10px;
transform: translate3d(0px, 0px, 0px);
contain: strict;
"
></div>
</div>
<div
role="presentation"
aria-hidden="true"
class="invisible scrollbar vertical"
style="position: absolute"
>
<div
class="slider"
style="
position: absolute;
top: 0px;
left: 0px;
width: 10px;
transform: translate3d(0px, 0px, 0px);
contain: strict;
"
></div>
</div>
<div class="shadow"></div>
<div class="shadow"></div>
<div class="shadow"></div>
</div>
</div>
</div>
<div
data-mprt="9"
class="minimap slider-mouseover"
role="presentation"
aria-hidden="true"
style="position: absolute; left: 0px; width: 0px; height: 30px"
>
<div class="minimap-shadow-hidden" style="height: 30px"></div>
<canvas
width="0"
height="45"
style="position: absolute; left: 0px; width: 0px; height: 30px"
></canvas
><canvas
class="minimap-decorations-layer"
width="0"
height="45"
style="position: absolute; left: 0px; width: 0px; height: 30px"
></canvas>
<div
class="minimap-slider"
style="
position: absolute;
transform: translate3d(0px, 0px, 0px);
contain: strict;
width: 0px;
"
>
<div
class="minimap-slider-horizontal"
style="position: absolute; width: 0px; height: 0px"
></div>
</div>
</div>
<div
role="presentation"
aria-hidden="true"
class="blockDecorations-container"
></div>
</div>
<div data-mprt="2" class="overflowingContentWidgets">
<div
widgetid="editor.contrib.resizableContentHoverWidget"
style="
position: fixed;
height: 27px;
width: 150px;
z-index: 50;
display: none;
visibility: hidden;
max-width: 1707px;
"
>
<div class="monaco-sash vertical" style="left: 148px"></div>
<div class="monaco-sash vertical" style="left: -2px"></div>
<div
class="monaco-sash orthogonal-edge-north horizontal"
style="top: -2px"
>
<div class="orthogonal-drag-handle start"></div>
<div class="orthogonal-drag-handle end"></div>
</div>
<div
class="monaco-sash orthogonal-edge-south horizontal"
style="top: 25px"
>
<div class="orthogonal-drag-handle start"></div>
<div class="orthogonal-drag-handle end"></div>
</div>
<div class="monaco-hover hidden" tabindex="0" role="tooltip">
<div
class="monaco-scrollable-element"
role="presentation"
style="position: relative; overflow: hidden"
>
<div class="monaco-hover-content" style="overflow: hidden"></div>
<div
role="presentation"
aria-hidden="true"
class="invisible scrollbar horizontal"
style="position: absolute"
>
<div
class="slider"
style="
position: absolute;
top: 0px;
left: 0px;
height: 10px;
transform: translate3d(0px, 0px, 0px);
contain: strict;
"
></div>
</div>
<div
role="presentation"
aria-hidden="true"
class="invisible scrollbar vertical"
style="position: absolute"
>
<div
class="slider"
style="
position: absolute;
top: 0px;
left: 0px;
width: 10px;
transform: translate3d(0px, 0px, 0px);
contain: strict;
"
></div>
</div>
<div class="shadow"></div>
<div class="shadow"></div>
<div class="shadow"></div>
</div>
</div>
</div>
<div
class="editor-widget suggest-widget"
widgetid="editor.widget.suggestWidget"
style="
position: fixed;
display: none;
visibility: hidden;
max-width: 1317px;
height: 21px;
width: 215px;
top: 120.667px;
left: 477.667px;
"
>
<div class="monaco-sash vertical disabled" style="left: 213px"></div>
<div class="monaco-sash vertical disabled" style="left: -2px"></div>
<div
class="monaco-sash orthogonal-edge-north horizontal disabled"
style="top: -2px"
></div>
<div
class="monaco-sash orthogonal-edge-south horizontal disabled"
style="top: 19px"
></div>
<div class="message" style="display: none" aria-hidden="true">
No suggestions.
</div>
<div class="tree" aria-hidden="true" style="height: 21px; display: none">
<div
class="monaco-list list_id_1 selection-none"
tabindex="0"
role="listbox"
aria-label="Suggest"
>
<div
class="monaco-scrollable-element"
role="presentation"
style="position: relative; overflow: hidden"
>
<div
class="monaco-list-rows"
style="
transform: translate3d(0px, 0px, 0px);
overflow: hidden;
contain: strict;
height: 0px;
left: 0px;
top: 0px;
"
></div>
<div
role="presentation"
aria-hidden="true"
class="invisible scrollbar horizontal"
style="
position: absolute;
width: 0px;
height: 10px;
left: 0px;
bottom: 0px;
"
>
<div
class="slider"
style="
position: absolute;
top: 0px;
left: 0px;
height: 10px;
transform: translate3d(0px, 0px, 0px);
contain: strict;
width: 0px;
"
></div>
</div>
<div
role="presentation"
aria-hidden="true"
class="invisible scrollbar vertical fade"
style="
position: absolute;
width: 10px;
height: 21px;
right: 0px;
top: 0px;
"
>
<div
class="slider"
style="
position: absolute;
top: 0px;
left: 0px;
width: 10px;
transform: translate3d(0px, 0px, 0px);
contain: strict;
height: 21px;
"
></div>
</div>
</div>
<style type="text/css" media="screen">
.monaco-list.list_id_1:focus .monaco-list-row.focused {
background-color: var(--vscode-list-focusBackground);
}
.monaco-list.list_id_1:focus .monaco-list-row.focused:hover {
background-color: var(--vscode-list-focusBackground);
}
.monaco-list.list_id_1:focus .monaco-list-row.focused {
color: var(--vscode-list-focusForeground);
}
.monaco-list.list_id_1:focus .monaco-list-row.selected {
background-color: var(--vscode-list-activeSelectionBackground);
}
.monaco-list.list_id_1:focus .monaco-list-row.selected:hover {
background-color: var(--vscode-list-activeSelectionBackground);
}
.monaco-list.list_id_1:focus .monaco-list-row.selected {
color: var(--vscode-list-activeSelectionForeground);
}
.monaco-list.list_id_1:focus .monaco-list-row.selected .codicon {
color: var(--vscode-list-activeSelectionIconForeground);
}
.monaco-drag-image,
.monaco-list.list_id_1:focus .monaco-list-row.selected.focused {
background-color: var(--vscode-list-activeSelectionBackground);
}
.monaco-drag-image,
.monaco-list.list_id_1:focus .monaco-list-row.selected.focused {
color: var(--vscode-list-activeSelectionForeground);
}
.monaco-list.list_id_1 .monaco-list-row.focused .codicon {
color: var(--vscode-list-inactiveSelectionIconForeground);
}
.monaco-list.list_id_1 .monaco-list-row.focused {
background-color: var(
--vscode-editorSuggestWidget-selectedBackground
);
}
.monaco-list.list_id_1 .monaco-list-row.focused:hover {
background-color: var(
--vscode-editorSuggestWidget-selectedBackground
);
}
.monaco-list.list_id_1 .monaco-list-row.selected {
background-color: var(--vscode-list-inactiveSelectionBackground);
}
.monaco-list.list_id_1 .monaco-list-row.selected:hover {
background-color: var(--vscode-list-inactiveSelectionBackground);
}
.monaco-list.list_id_1 .monaco-list-row.selected {
color: var(--vscode-list-inactiveSelectionForeground);
}
.monaco-list.list_id_1:not(.drop-target):not(.dragging)
.monaco-list-row:hover:not(.selected):not(.focused) {
background-color: var(--vscode-list-hoverBackground);
}
.monaco-list.list_id_1:not(.drop-target):not(.dragging)
.monaco-list-row:hover:not(.selected):not(.focused) {
color: var(--vscode-list-hoverForeground);
}
.monaco-list.list_id_1:focus .monaco-list-row.focused.selected {
outline: 1px solid
var(
--vscode-list-focusAndSelectionOutline,
var(
--vscode-contrastActiveBorder,
var(--vscode-list-focusOutline)
)
);
outline-offset: -1px;
}
.monaco-drag-image,
.monaco-list.list_id_1:focus .monaco-list-row.focused {
outline: 1px solid var(--vscode-list-focusOutline);
outline-offset: -1px;
}
.monaco-workbench.context-menu-visible
.monaco-list.list_id_1.last-focused
.monaco-list-row.focused {
outline: 1px solid var(--vscode-list-focusOutline);
outline-offset: -1px;
}
.monaco-list.list_id_1 .monaco-list-row.focused.selected {
outline: 1px dotted
var(
--vscode-contrastActiveBorder,
var(--vscode-contrastActiveBorder)
);
outline-offset: -1px;
}
.monaco-list.list_id_1 .monaco-list-row.selected {
outline: 1px dotted var(--vscode-contrastActiveBorder);
outline-offset: -1px;
}
.monaco-list.list_id_1 .monaco-list-row.focused {
outline: 1px dotted var(--vscode-contrastActiveBorder);
outline-offset: -1px;
}
.monaco-list.list_id_1 .monaco-list-row:hover {
outline: 1px dashed var(--vscode-contrastActiveBorder);
outline-offset: -1px;
}
.monaco-list.list_id_1.drop-target,
.monaco-list.list_id_1 .monaco-list-rows.drop-target,
.monaco-list.list_id_1 .monaco-list-row.drop-target {
background-color: var(--vscode-list-dropBackground) !important;
color: inherit !important;
}
.monaco-list.list_id_1
.monaco-list-rows.drop-target-before
.monaco-list-row:first-child::before,
.monaco-list.list_id_1 .monaco-list-row.drop-target-before::before {
content: "";
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 1px;
background-color: var(--vscode-list-dropBetweenBackground);
}
.monaco-list.list_id_1
.monaco-list-rows.drop-target-after
.monaco-list-row:last-child::after,
.monaco-list.list_id_1 .monaco-list-row.drop-target-after::after {
content: "";
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
height: 1px;
background-color: var(--vscode-list-dropBetweenBackground);
}
.monaco-table > .monaco-split-view2,
.monaco-table > .monaco-split-view2 .monaco-sash.vertical::before,
.monaco-workbench:not(.reduce-motion)
.monaco-table:hover
> .monaco-split-view2,
.monaco-workbench:not(.reduce-motion)
.monaco-table:hover
> .monaco-split-view2
.monaco-sash.vertical::before {
border-color: var(--vscode-tree-tableColumnsBorder);
}
.monaco-workbench:not(.reduce-motion)
.monaco-table
> .monaco-split-view2,
.monaco-workbench:not(.reduce-motion)
.monaco-table
> .monaco-split-view2
.monaco-sash.vertical::before {
border-color: transparent;
}
.monaco-table
.monaco-list-row[data-parity="odd"]:not(.focused):not(
.selected
):not(:hover)
.monaco-table-tr,
.monaco-table
.monaco-list:not(:focus)
.monaco-list-row[data-parity="odd"].focused:not(.selected):not(
:hover
)
.monaco-table-tr,
.monaco-table
.monaco-list:not(.focused)
.monaco-list-row[data-parity="odd"].focused:not(.selected):not(
:hover
)
.monaco-table-tr {
background-color: var(--vscode-tree-tableOddRowsBackground);
}
</style>
</div>
</div>
<div
class="suggest-status-bar"
aria-hidden="true"
style="height: 19px; display: none"
>
<div class="monaco-action-bar left">
<ul class="actions-container" role="toolbar">
<li
class="action-item disabled menu-entry"
role="presentation"
custom-hover="true"
>
<a
class="action-label disabled"
role="button"
aria-label="Insert (Enter)"
aria-disabled="true"
tabindex="0"
>Insert (⏎)</a
>
</li>
</ul>
</div>
<div class="monaco-action-bar right">
<ul class="actions-container" role="toolbar">
<li
class="action-item disabled menu-entry"
role="presentation"
custom-hover="true"
>
<a
class="action-label disabled"
role="button"
aria-label="show more (Ctrl+Space)"
aria-disabled="true"
tabindex="0"
>show more (Ctrl+Space)</a
>
</li>
</ul>
</div>
</div>
</div>
<div
class="editor-widget parameter-hints-widget"
widgetid="editor.widget.parameterHintsWidget"
style="
user-select: text;
position: fixed;
display: none;
visibility: hidden;
max-width: 1317px;
font-size: 14px;
line-height: 1.35714;
max-height: 250px;
top: 120.667px;
left: 477.667px;
"
>
<div class="phwrapper" tabindex="-1" style="max-height: 250px">
<div class="controls">
<div class="button codicon codicon-parameter-hints-previous"></div>
<div class="overloads">1/1</div>
<div class="button codicon codicon-parameter-hints-next"></div>
</div>
<div
class="monaco-scrollable-element"
role="presentation"
style="position: relative; overflow: hidden"
>
<div class="body" style="overflow: hidden">
<div class="signature has-docs">
<div
class="code"
style="
font-size: 14px;
font-family: Menlo, Consolas, monospace, sans-serif;
"
>
<span>Search(</span><span class="parameter active">source</span
><span>, text, column, ...)</span>
</div>
</div>
<div class="docs">
<p><span class="documentation">Table to search.</span></p>
<p>
Searches text in 'source'. Returns rows where text is found.
Comparison is done in case-insensitive manner.
</p>
</div>
</div>
<div
role="presentation"
aria-hidden="true"
class="invisible scrollbar horizontal"
style="
position: absolute;
width: 430px;
height: 10px;
left: 0px;
bottom: 0px;
"
>
<div
class="slider"
style="
position: absolute;
top: 0px;
left: 0px;
height: 10px;
transform: translate3d(0px, 0px, 0px);
contain: strict;
width: 430px;
"
></div>
</div>
<div
role="presentation"
aria-hidden="true"
class="invisible scrollbar vertical"
style="
position: absolute;
width: 10px;
height: 108px;
right: 0px;
top: 0px;
"
>
<div
class="slider"
style="
position: absolute;
top: 0px;
left: 0px;
width: 10px;
transform: translate3d(0px, 0px, 0px);
contain: strict;
height: 108px;
"
></div>
</div>
<div class="shadow"></div>
<div class="shadow"></div>
<div class="shadow"></div>
</div>
</div>
</div>
</div>
<div data-mprt="5" class="overflowingOverlayWidgets"></div>
</div>
Ready to run.
| Test | Ops/sec | |
|---|---|---|
| getElement | | ready |
| querySelector | | ready |
You can edit these tests or add more tests to this page by appending /edit to the URL.