Skip to content

Commit 6f5ab18

Browse files
KobzolKobzol
committed
Split benchmarks on compare page to two categories based on primary/secondary distinction
1 parent 581a35b commit 6f5ab18

File tree

1 file changed

+125
-82
lines changed

1 file changed

+125
-82
lines changed

‎site/static/compare.html

Lines changed: 125 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -189,11 +189,11 @@
189189
cursor: help;
190190
}
191191

192-
#benches {
192+
.benches {
193193
font-size: medium;
194194
}
195195

196-
#benches tbody::before {
196+
.benches tbody::before {
197197
content: '';
198198
display: block;
199199
height: 10px;
@@ -207,29 +207,33 @@
207207
text-align: center;
208208
}
209209

210-
#benches tbody:first-child th {
210+
.benches tbody:first-child th {
211211
text-align: center;
212212
}
213213

214-
#benches tbody:not(:first-child) th {
214+
.benches tbody:not(:first-child) th {
215215
border-right: dotted 1px;
216216
}
217217

218-
#benches th {
218+
.benches th {
219219
text-align: left;
220220
word-break: break-word;
221221
width: 25%;
222222
min-width: 50px;
223223
}
224224

225-
#benches th+td {
225+
.benches th+td {
226226
width: 25%;
227227
}
228228

229229
.benchmark-name {
230230
text-align: center;
231231
}
232232

233+
.bench-table {
234+
margin-top: 10px;
235+
}
236+
233237
#summary {
234238
border: 1px dashed;
235239
padding: 4px;
@@ -499,62 +503,20 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
499503
</details>
500504
<hr />
501505
</div>
502-
<table id="benches" class="compare">
503-
<thead>
504-
<tr>
505-
<th>Benchmark & Profile</th>
506-
<th>Scenario</th>
507-
<th>% Change</th>
508-
<th>
509-
Significance Factor
510-
<span class="tooltip">?
511-
<span class="tooltiptext">
512-
How much a particular result is over the significance threshold. A factor of 2.50x
513-
means
514-
the result is 2.5 times over the significance threshold. You can see <a
515-
href="https://github.com/rust-lang/rustc-perf/blob/master/docs/comparison-analysis.md#what-makes-a-test-result-significant">
516-
here</a> how the significance threshold is calculated.
517-
</span>
518-
</span>
519-
</th>
520-
<th v-if="showRawData">{{before}}</th>
521-
<th v-if="showRawData">{{after}}</th>
522-
</tr>
523-
</thead>
524-
<tbody v-if="testCases.length === 0">
525-
<tr>
526-
<td colspan="6">No results</td>
527-
</tr>
528-
</tbody>
529-
<tbody v-else>
530-
<template v-for="testCase in testCases">
531-
<tr>
532-
<td>{{ testCase.benchmark }} {{ testCase.profile }}</td>
533-
<td>{{ testCase.scenario }}</td>
534-
<td>
535-
<a v-bind:href="percentLink(data.b.commit, data.a.commit, testCase)">
536-
<span v-bind:class="percentClass(testCase.percent)">
537-
{{ testCase.percent.toFixed(2) }}%{{testCase.isDodgy ? "?" : ""}}
538-
</span>
539-
</a>
540-
</td>
541-
<td>
542-
{{ testCase.significanceFactor ? testCase.significanceFactor.toFixed(2) + "x" : "-" }}
543-
</td>
544-
<td v-if="showRawData">
545-
<a v-bind:href="detailedQueryLink(data.a.commit, testCase)">
546-
<abbr :title="testCase.datumA">{{ testCase.datumA.toFixed(2) }}</abbr>
547-
</a>
548-
</td>
549-
<td v-if="showRawData">
550-
<a v-bind:href="detailedQueryLink(data.b.commit, testCase)">
551-
<abbr :title="testCase.datumB">{{ testCase.datumB.toFixed(2) }}</abbr>
552-
</a>
553-
</td>
554-
</tr>
555-
</template>
556-
</tbody>
557-
</table>
506+
507+
<test-cases-table
508+
title="Primary"
509+
:cases="testCases.filter(c => c.category === 'primary')"
510+
:show-raw-data="showRawData"
511+
:commit-a="data.a.commit"
512+
:commit-b="data.b.commit"></test-cases-table>
513+
<hr />
514+
<test-cases-table
515+
title="Secondary"
516+
:cases="testCases.filter(c => c.category === 'secondary')"
517+
:show-raw-data="showRawData"
518+
:commit-a="data.a.commit"
519+
:commit-b="data.b.commit"></test-cases-table>
558520
<br />
559521
<table id="bootstrap" class="compare" style="margin: auto;"
560522
v-if="data && Object.keys(data.a.bootstrap).length > 0">
@@ -601,6 +563,94 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
601563
return unescape(pair[1]);
602564
}
603565
}
566+
567+
Vue.mixin({
568+
methods: {
569+
percentClass(pct) {
570+
let klass = "";
571+
if (pct > 1) {
572+
klass = 'positive';
573+
} else if (pct > 0) {
574+
klass = 'slightly-positive';
575+
} else if (pct < -1) {
576+
klass = 'negative';
577+
} else if (pct < -0) {
578+
klass = 'slightly-negative';
579+
}
580+
return klass;
581+
},
582+
}
583+
});
584+
Vue.component('test-cases-table', {
585+
props: ['cases', 'showRawData', 'commitA', 'commitB', 'title'],
586+
methods: {
587+
detailedQueryLink(commit, testCase) {
588+
return `/detailed-query.html?commit=${commit}&benchmark=${testCase.benchmark + "-" + testCase.profile}&scenario=${testCase.scenario}`;
589+
},
590+
percentLink(commit, baseCommit, testCase) {
591+
return `/detailed-query.html?commit=${commit}&base_commit=${baseCommit}&benchmark=${testCase.benchmark + "-" + testCase.profile}&scenario=${testCase.scenario}`;
592+
},
593+
},
594+
template: `
595+
<div class="bench-table">
596+
<div>{{ title }} benchmarks</div>
597+
<div v-if="cases.length === 0">
598+
No results
599+
</div>
600+
<table v-else class="benches compare">
601+
<thead>
602+
<tr>
603+
<th>Benchmark & Profile</th>
604+
<th>Scenario</th>
605+
<th>% Change</th>
606+
<th>
607+
Significance Factor
608+
<span class="tooltip">?
609+
<span class="tooltiptext">
610+
How much a particular result is over the significance threshold. A factor of 2.50x
611+
means
612+
the result is 2.5 times over the significance threshold. You can see <a
613+
href="https://github.com/rust-lang/rustc-perf/blob/master/docs/comparison-analysis.md#what-makes-a-test-result-significant">
614+
here</a> how the significance threshold is calculated.
615+
</span>
616+
</span>
617+
</th>
618+
<th v-if="showRawData">{{before}}</th>
619+
<th v-if="showRawData">{{after}}</th>
620+
</tr>
621+
</thead>
622+
<tbody>
623+
<template v-for="testCase in cases">
624+
<tr>
625+
<td>{{ testCase.benchmark }} {{ testCase.profile }}</td>
626+
<td>{{ testCase.scenario }}</td>
627+
<td>
628+
<a v-bind:href="percentLink(commitB, commitA, testCase)">
629+
<span v-bind:class="percentClass(testCase.percent)">
630+
{{ testCase.percent.toFixed(2) }}%{{testCase.isDodgy ? "?" : ""}}
631+
</span>
632+
</a>
633+
</td>
634+
<td>
635+
{{ testCase.significanceFactor ? testCase.significanceFactor.toFixed(2) + "x" : "-" }}
636+
</td>
637+
<td v-if="showRawData">
638+
<a v-bind:href="detailedQueryLink(commitA, testCase)">
639+
<abbr :title="testCase.datumA">{{ testCase.datumA.toFixed(2) }}</abbr>
640+
</a>
641+
</td>
642+
<td v-if="showRawData">
643+
<a v-bind:href="detailedQueryLink(commitB, testCase)">
644+
<abbr :title="testCase.datumB">{{ testCase.datumB.toFixed(2) }}</abbr>
645+
</a>
646+
</td>
647+
</tr>
648+
</template>
649+
</tbody>
650+
</table>
651+
</div>
652+
`});
653+
604654
let app = new Vue({
605655
el: '#app',
606656
data: {
@@ -635,6 +685,7 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
635685
testCases() {
636686
let data = this.data;
637687
const filter = this.filter;
688+
const benchmarkMap = this.benchmarkMap;
638689

639690
function scenarioFilter(scenario) {
640691
if (scenario === "full") {
@@ -673,6 +724,7 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
673724
benchmark: c.benchmark,
674725
profile: c.profile,
675726
scenario: c.scenario,
727+
category: (benchmarkMap[c.benchmark] || {}).category || "secondary",
676728
magnitude: c.magnitude,
677729
isSignificant: c.is_significant,
678730
significanceFactor: c.significance_factor,
@@ -810,6 +862,17 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
810862

811863
return result;
812864

865+
},
866+
benchmarkMap() {
867+
if (!this.data) return {};
868+
869+
const benchmarks = {};
870+
for (const benchmark of this.data.benchmark_data) {
871+
benchmarks[benchmark.name] = {
872+
"category": benchmark.category
873+
};
874+
}
875+
return benchmarks;
813876
}
814877
},
815878
methods: {
@@ -825,19 +888,6 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
825888
}
826889
return "";
827890
},
828-
percentClass(pct) {
829-
let klass = "";
830-
if (pct > 1) {
831-
klass = 'positive';
832-
} else if (pct > 0) {
833-
klass = 'slightly-positive';
834-
} else if (pct < -1) {
835-
klass = 'negative';
836-
} else if (pct < -0) {
837-
klass = 'slightly-negative';
838-
}
839-
return klass;
840-
},
841891
diffClass(diff) {
842892
let klass = "";
843893
if (diff > 1) {
@@ -848,12 +898,6 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
848898
return klass;
849899

850900
},
851-
detailedQueryLink(commit, testCase) {
852-
return `/detailed-query.html?commit=${commit}&benchmark=${testCase.benchmark + "-" + testCase.profile}&scenario=${testCase.scenario}`;
853-
},
854-
percentLink(commit, baseCommit, testCase) {
855-
return `/detailed-query.html?commit=${commit}&base_commit=${baseCommit}&benchmark=${testCase.benchmark + "-" + testCase.profile}&scenario=${testCase.scenario}`;
856-
},
857901
commitLink(commit) {
858902
return `https://github.com/rust-lang/rust/commit/${commit}`;
859903
},
@@ -923,7 +967,6 @@ <h2>Comparing <span id="stat-header">{{stat}}</span> between <span id="before">{
923967
});
924968
}
925969

926-
927970
function submitSettings() {
928971
let start = document.getElementById("start-bound").value;
929972
let end = document.getElementById("end-bound").value;

0 commit comments

Comments
 (0)