diff --git a/gravitons/index.html b/gravitons/index.html
index f2adb03378..6673066be8 100644
--- a/gravitons/index.html
+++ b/gravitons/index.html
@@ -91,7 +91,7 @@
}
.selectors-container {
- padding: 2rem 0 2rem 0;
+ padding: 1rem 0 2rem 0;
user-select: none;
}
@@ -111,6 +111,7 @@
color: var(--selector-text-color);
border: 0.2rem solid var(--background-color);
border-radius: 0.5rem;
+ cursor: pointer;
}
.selector-active {
@@ -164,6 +165,17 @@
white-space: nowrap;
}
+ #summary-table {
+ width: 100%;
+ max-height: 45vh;
+ overflow-y: auto;
+ scrollbar-gutter: stable;
+ padding-right: 1rem;
+ margin-top: 1.5rem;
+ margin-bottom: 1rem;
+ display: block;
+ }
+
th {
padding-bottom: 0.5rem;
}
@@ -358,6 +370,21 @@ ClickHouse Hardware Benchmark
Source | Add a New Result | Report Mistake | Benchmark For Analytical DBMS | Versions Benchmark
+
+
+
+ |
+ Machine
+ |
+
+ Relative time (lower is better)
+ |
+
+
+
+
+
+
| Machine: |
@@ -380,21 +407,6 @@ ClickHouse Hardware Benchmark
-
-
-
- |
- Machine
- |
-
- Relative time (lower is better)
- |
-
-
-
-
-
-
Nothing selected
diff --git a/hardware/index.html b/hardware/index.html
index a51559e3df..f58be8a555 100644
--- a/hardware/index.html
+++ b/hardware/index.html
@@ -103,7 +103,7 @@
}
.selectors-container {
- padding: 2rem 0 2rem 0;
+ padding: 1rem 0 2rem 0;
user-select: none;
}
@@ -123,6 +123,7 @@
color: var(--selector-text-color);
border: 0.2rem solid var(--background-color);
border-radius: 0.5rem;
+ cursor: pointer;
}
.selector-active {
@@ -180,6 +181,17 @@
white-space: nowrap;
}
+ #summary-table {
+ width: 100%;
+ max-height: 45vh;
+ overflow-y: auto;
+ scrollbar-gutter: stable;
+ padding-right: 1rem;
+ margin-top: 1.5rem;
+ margin-bottom: 1rem;
+ display: block;
+ }
+
th {
padding-bottom: 0.5rem;
}
@@ -554,6 +566,22 @@
ClickHouse Hardware Benchmark
Source |
Add a New Result |
Report Mistake |
Benchmark For Analytical DBMS |
Versions Benchmark
+
+
+ |
+ Machine
+ |
+
+ Relative time (lower is better).
+
+ |
+
+
+
+
+
+
| Machine: |
@@ -576,22 +604,6 @@ ClickHouse Hardware Benchmark
-
-
-
- |
- Machine
- |
-
- Relative time (lower is better).
-
- |
-
-
-
-
-
-
Nothing selected
diff --git a/index.html b/index.html
index d92b28c91c..a9cf1a9142 100644
--- a/index.html
+++ b/index.html
@@ -136,6 +136,7 @@
color: var(--selector-text-color);
border: 0.2rem solid var(--background-color);
border-radius: 0.5rem;
+ cursor: pointer;
}
.selector-active {
@@ -214,18 +215,27 @@
white-space: nowrap;
}
+ #summary-table {
+ width: 100%;
+ max-height: 45vh;
+ overflow-y: auto;
+ scrollbar-gutter: stable;
+ padding-right: 1rem;
+ margin-top: 1.5rem;
+ margin-bottom: 1rem;
+ display: block;
+ }
+
th {
padding-bottom: 0.5rem;
}
.th-entry-hilite {
background: var(--highlight-color);
- font-weight: bold;
}
.summary-row:hover, .summary-row-hilite {
background: var(--highlight-color) !important;
- font-weight: bold;
}
.remove-system {
@@ -269,6 +279,15 @@
#nothing-selected {
display: none;
+ width: 100%;
+ height: 45vh;
+ overflow-y: scroll;
+ scrollbar-gutter: stable;
+ box-sizing: border-box;
+ align-items: center;
+ padding-right: 1rem;
+ margin-top: 1.5rem;
+ margin-bottom: 1rem;
font-size: 32pt;
font-weight: bold;
color: var(--nothing-selected-color);
@@ -423,24 +442,39 @@
ClickBench — a Benchmark For Analytical DBMS
Methodology |
Reproduce and Validate the Results |
Add a System |
Hardware Benchmark |
Versions Benchmark | See also:
JSONBench
+
+
+ |
+ System & Machine
+ |
+
+ Relative time (lower is better).
+
+ |
+
+
+
+
+
+
+Nothing selected
+
-
-
-
- |
- System & Machine
- |
-
- Relative time (lower is better).
-
- |
-
-
-
-
-
-
-Nothing selected
-
Detailed Comparison
@@ -517,6 +544,7 @@ Detailed Comparison
const missing_result_time = 300;
let selectors = {
+ "database": {},
"system": {},
"type": {},
"machine": {},
@@ -548,12 +576,30 @@ Detailed Comparison
/// Generate selectors
+let databases = document.getElementById('selectors_database');
let systems = document.getElementById('selectors_system');
let types = document.getElementById('selectors_type');
let machines = document.getElementById('selectors_machine');
let cluster_sizes = document.getElementById('selectors_cluster_size');
-let unique_systems = [... new Set(data.map(elem => elem.system))].sort((a, b) => a.localeCompare(b, undefined, {numeric: true, sensitivity: 'base'}));
+function database(system_name) {
+ // Remove any parenthesized comments from the system name
+ // They only contain variations of the same DB and pollute the selectors
+ const base = system_name.replace(/\s*\([^)]*\)\s*$/, '');
+ const aliases = {
+ 'ClickHouse ☁️': 'ClickHouse',
+ 'Timescale ☁️': 'TimescaleDB',
+ };
+ return aliases[base] || base;
+}
+
+data.forEach(elem => { elem.database = database(elem.system); });
+additional_data_size_points.forEach(elem => { elem.database = database(elem.system); });
+
+const uniqueSorted = values => [... new Set(values)].sort((a, b) => a.localeCompare(b, undefined, {numeric: true, sensitivity: 'base'}));
+
+let unique_databases = uniqueSorted(data.map(elem => elem.database));
+let all_systems = uniqueSorted(data.map(elem => elem.system));
const system_to_tags = {};
data.forEach(d => {
@@ -593,7 +639,28 @@ Detailed Comparison
updateHistory();
}
-unique_systems.map(elem => {
+unique_databases.map(elem => {
+ let selector = document.createElement('a');
+ selector.className = 'selector selector-active';
+ selector.appendChild(document.createTextNode(elem));
+ databases.appendChild(selector);
+ selectors.database[elem] = data.some(entry => entry.database == elem && !entry.hide);
+ selector.addEventListener('click', e => toggle(e, elem, selectors.database));
+
+ /// Highlighting summary rows and table columns on hovering over the database selector.
+ selector.addEventListener('mouseover', e => {
+ [...document.querySelectorAll('.summary-row')].map(row => {
+ row.className = row.dataset.database == elem ? 'summary-row summary-row-hilite' : 'summary-row' });
+ [...document.querySelectorAll('.th-entry')].map(th => {
+ th.className = th.dataset.database == elem ? 'th-entry th-entry-hilite' : 'th-entry' });
+ });
+ selector.addEventListener('mouseout', e => {
+ [...document.querySelectorAll('.summary-row')].map(row => { row.className = 'summary-row' });
+ [...document.querySelectorAll('.th-entry')].map(row => { row.className = 'th-entry' });
+ });
+});
+
+all_systems.map(elem => {
let selector = document.createElement('a');
selector.className = 'selector selector-active';
selector.appendChild(document.createTextNode(elem));
@@ -601,7 +668,7 @@ Detailed Comparison
selectors.system[elem] = data.some(entry => entry.system == elem && !entry.hide);
selector.addEventListener('click', e => toggle(e, elem, selectors.system));
- /// Highlighting summary rows and table columns on hovering over the system selector.
+ /// Highlighting summary rows and table columns on hovering over the database selector.
selector.addEventListener('mouseover', e => {
[...document.querySelectorAll('.summary-row')].map(row => {
row.className = row.dataset.system == elem ? 'summary-row summary-row-hilite' : 'summary-row' });
@@ -735,6 +802,7 @@ Detailed Comparison
updateHistory();
});
+document.getElementById('select-all-databases').addEventListener('click', e => toggleAll(e, selectors.database));
document.getElementById('select-all-systems').addEventListener('click', e => toggleAll(e, selectors.system));
document.getElementById('select-all-types').addEventListener('click', e => toggleAll(e, selectors.type));
document.getElementById('select-all-machines').addEventListener('click', e => toggleAll(e, selectors.machine));
@@ -753,7 +821,8 @@ Detailed Comparison
selectors.queries = [...data[0].result.keys()].map(k => true);
function updateSelectors() {
- [...systems.childNodes].map(elem => { elem.className = selectors.system[elem.innerText] ? 'selector selector-active' : 'selector' });
+ [...databases.childNodes].map(elem => { elem.className = selectors.database[elem.innerText] ? 'selector selector-active' : 'selector' });
+ [...systems.childNodes].map(elem => { elem.className = selectors.system[elem.textContent] ? 'selector selector-active' : 'selector' });
[...types.childNodes].map(elem => { elem.className = selectors.type[elem.innerText] ? 'selector selector-active' : 'selector' });
[...machines.childNodes].map(elem => { elem.className = selectors.machine[elem.innerText] ? 'selector selector-active' : 'selector' });
[...cluster_sizes.childNodes].map(elem => { elem.className = selectors.cluster_size[elem.innerText] ? 'selector selector-active' : 'selector' });
@@ -807,6 +876,7 @@ Detailed Comparison
}
}
}
+ process('database', databases);
process('system', systems);
process('tags', types);
process('machine', machines);
@@ -934,6 +1004,7 @@ Detailed Comparison
tr.className = 'summary-row';
tr.dataset.system = elem.system;
+ tr.dataset.database = elem.database;
tr.addEventListener('mouseover', () => highlightSystemTags(elem.system));
tr.addEventListener('mouseout', clearSystemTagsHighlight);
@@ -1077,6 +1148,7 @@ Detailed Comparison
applyTopRowFilters();
let filtered_data = data.filter(elem =>
+ selectors.database[elem.database] &&
selectors.system[elem.system] &&
selectors.machine[elem.machine] &&
selectors.cluster_size[elem.cluster_size] &&
@@ -1139,6 +1211,7 @@ Detailed Comparison
th.appendChild(document.createTextNode(`${elem.system}\n(${Number.isInteger(elem.cluster_size) && elem.cluster_size > 1 ? elem.cluster_size + '×': ''}${elem.machine})`));
th.className = 'th-entry';
th.dataset.system = elem.system;
+ th.dataset.database = elem.database;
th.addEventListener('mouseover', () => highlightSystemTags(elem.system));
th.addEventListener('mouseout', clearSystemTagsHighlight);
details_head.appendChild(th);
@@ -1330,14 +1403,17 @@ Detailed Comparison
return decoded;
}
-function updateHistory() {
- history.pushState(selectors, '',
- window.location.pathname + (window.location.search || '') + '#' + encodeState(selectors));
-}
-
-window.onpopstate = function(event) {
- if (!event.state) { return; }
- selectors = event.state;
+function addMissingSelectors() {
+ if (!selectors.database) {
+ selectors.database = {};
+ if (selectors.system) {
+ const selected_databases = new Set(
+ data.filter(elem => selectors.system[elem.system]).map(elem => elem.database));
+ unique_databases.forEach(k => { selectors.database[k] = selected_databases.has(k) });
+ } else {
+ unique_databases.forEach(k => { selectors.database[k] = true });
+ }
+ }
if (!selectors.opensource) {
selectors.opensource = {"yes": true, "no": false};
}
@@ -1347,6 +1423,17 @@ Detailed Comparison
if (!selectors.tuned) {
selectors.tuned = {"no": true, "yes": false};
}
+}
+
+function updateHistory() {
+ history.pushState(selectors, '',
+ window.location.pathname + (window.location.search || '') + '#' + encodeState(selectors));
+}
+
+window.onpopstate = function(event) {
+ if (!event.state) { return; }
+ selectors = event.state;
+ addMissingSelectors();
updateSelectors();
render();
};
@@ -1354,15 +1441,7 @@ Detailed Comparison
if (window.location.hash) {
try {
selectors = decodeState(decodeURIComponent(window.location.hash.substring(1)));
- if (!selectors.opensource) {
- selectors.opensource = {"yes": true, "no": false};
- }
- if (!selectors.hardware) {
- selectors.hardware = {"cpu": true, "gpu": false};
- }
- if (!selectors.tuned) {
- selectors.tuned = {"no": true, "yes": false};
- }
+ addMissingSelectors();
} catch {}
}
diff --git a/versions/index.html b/versions/index.html
index 3923323b0a..8fbaf11a5f 100644
--- a/versions/index.html
+++ b/versions/index.html
@@ -91,7 +91,7 @@
}
.selectors-container {
- padding: 2rem 0 2rem 0;
+ padding: 1rem 0 2rem 0;
user-select: none;
}
@@ -111,6 +111,7 @@
color: var(--selector-text-color);
border: 0.2rem solid var(--background-color);
border-radius: 0.5rem;
+ cursor: pointer;
}
.selector-active {
@@ -164,6 +165,17 @@
white-space: nowrap;
}
+ #summary-table {
+ width: 100%;
+ max-height: 45vh;
+ overflow-y: auto;
+ scrollbar-gutter: stable;
+ padding-right: 1rem;
+ margin-top: 1.5rem;
+ margin-bottom: 1rem;
+ display: block;
+ }
+
th {
padding-bottom: 0.5rem;
}
@@ -490,6 +502,21 @@ ClickHouse Versions Benchmark
Source | Report Mistake | Benchmark For Analytical DBMS | Hardware Benchmark
+
+
+
+ |
+ version
+ |
+
+ Relative time (lower is better)
+ |
+
+
+
+
+
+
| Version: |
@@ -506,21 +533,6 @@ ClickHouse Versions Benchmark
-
-
-
- |
- version
- |
-
- Relative time (lower is better)
- |
-
-
-
-
-
-
Nothing selected