Skip to content

Commit 6bf2587

Browse files
KobzolKobzol
committed
Refactor URL creation functions
1 parent efc9a8e commit 6bf2587

File tree

6 files changed

+83
-84
lines changed

6 files changed

+83
-84
lines changed

‎site/frontend/src/pages/bootstrap/page.vue

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -5,34 +5,34 @@ import {withLoading} from "../../utils/loading";
55
import {renderPlots} from "./plots";
66
import {BootstrapData, BootstrapSelector} from "./state";
77
import {BOOTSTRAP_DATA_URL} from "../../urls";
8-
import {createUrlParams, getUrlParams, navigateToUrlParams} from "../../utils/navigation";
8+
import {createUrlWithAppendedParams, getUrlParams, navigateToUrlParams} from "../../utils/navigation";
99
1010
import {postJson} from "../../utils/requests";
1111
1212
async function loadBootstrapData(selector: BootstrapSelector, loading: Ref<boolean>) {
13-
const bootstrapData: BootstrapData = await withLoading(loading, () => postJson<BootstrapData>(BOOTSTRAP_DATA_URL, selector));
13+
const bootstrapData: BootstrapData = await withLoading(loading, () => postJson<BootstrapData>(BOOTSTRAP_DATA_URL, selector));
1414
15-
// Wait for the UI to be updated, which also resets the plot HTML elements.
16-
// Then draw the plots.
17-
await nextTick();
18-
renderPlots(bootstrapData, selector);
15+
// Wait for the UI to be updated, which also resets the plot HTML elements.
16+
// Then draw the plots.
17+
await nextTick();
18+
renderPlots(bootstrapData, selector);
1919
}
2020
2121
function loadSelectorFromUrl(urlParams: Dict<string>): BootstrapSelector {
22-
const start = urlParams["start"] ?? "";
23-
const end = urlParams["end"] ?? "";
24-
return {
25-
start,
26-
end,
27-
min_seconds: 25
28-
};
22+
const start = urlParams["start"] ?? "";
23+
const end = urlParams["end"] ?? "";
24+
return {
25+
start,
26+
end,
27+
min_seconds: 25
28+
};
2929
}
3030
3131
function updateSelection(params: SelectionParams) {
32-
navigateToUrlParams(createUrlParams({
33-
start: params.start,
34-
end: params.end
35-
}));
32+
navigateToUrlParams(createUrlWithAppendedParams({
33+
start: params.start,
34+
end: params.end
35+
}).searchParams);
3636
}
3737
3838
const loading = ref(true);

‎site/frontend/src/pages/compare/header/quick-links.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script setup lang="ts">
2-
import {createUrlWithParams, getUrlParams} from "../../../utils/navigation";
2+
import {createUrlWithAppendedParams, getUrlParams} from "../../../utils/navigation";
33
44
const props = defineProps<{stat: string}>();
55
@@ -14,7 +14,7 @@ function createMetric(label: string, stat: string, description: string): {
1414
function createUrlForMetric(stat: string): string {
1515
const params = getUrlParams();
1616
params["stat"] = stat;
17-
return createUrlWithParams(params).toString();
17+
return createUrlWithAppendedParams(params).toString();
1818
}
1919
2020
const metrics = [

‎site/frontend/src/pages/compare/page.vue

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import {loadBenchmarkInfo} from "../../api";
33
import AsOf from "../../components/as-of.vue";
44
import {
55
createUrlFromParams,
6-
createUrlParams,
6+
createUrlWithAppendedParams,
77
getUrlParams,
88
navigateToUrlParams
99
} from "../../utils/navigation";
@@ -118,11 +118,11 @@ async function loadCompareData(selector: CompareSelector, loading: Ref<boolean>)
118118
}
119119
120120
function updateSelection(params: SelectionParams) {
121-
navigateToUrlParams(createUrlParams({
121+
navigateToUrlParams(createUrlWithAppendedParams({
122122
start: params.start,
123123
end: params.end,
124124
stat: params.stat
125-
}));
125+
}).searchParams);
126126
}
127127
128128
function updateFilter(newFilter: DataFilter) {

‎site/frontend/src/pages/detailed-query.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {createUrlWithParams, getUrlParams} from "../utils/navigation";
1+
import {createUrlWithAppendedParams, getUrlParams} from "../utils/navigation";
22
import {postMsgpack} from "../utils/requests";
33
import {SELF_PROFILE_DATA_URL} from "../urls";
44

@@ -158,7 +158,7 @@ function populate_data(data, state: Selector) {
158158
}
159159
}
160160
let inner = th.innerHTML;
161-
th.innerHTML = `<a href="${createUrlWithParams(clickState).toString()}">${inner}</a>`;
161+
th.innerHTML = `<a href="${createUrlWithAppendedParams(clickState).toString()}">${inner}</a>`;
162162
}
163163

164164
if (!state.scenario.includes("incr-")) {

‎site/frontend/src/pages/graphs/page.vue

Lines changed: 54 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -4,39 +4,38 @@ import {withLoading} from "../../utils/loading";
44
import {GraphData, GraphKind, GraphsSelector} from "./state";
55
import {GRAPH_DATA_URL} from "../../urls";
66
import DataSelector, {SelectionParams} from "./data-selector.vue";
7-
import {getUrlParams} from "../../utils/navigation";
7+
import {createUrlWithAppendedParams, getUrlParams, navigateToUrlParams} from "../../utils/navigation";
88
import {renderPlots} from "./plots";
9-
import {createUrlParams, navigateToUrlParams} from "../../utils/navigation";
109
import {getJson} from "../../utils/requests";
1110
import {BenchmarkInfo, loadBenchmarkInfo} from "../../api";
1211
import AsOf from "../../components/as-of.vue";
1312
1413
function loadSelectorFromUrl(urlParams: Dict<string>): GraphsSelector {
15-
const start = urlParams["start"] ?? "";
16-
const end = urlParams["end"] ?? "";
17-
const kind: GraphKind = urlParams["kind"] as GraphKind ?? "raw";
18-
const stat = urlParams["stat"] ?? "instructions:u";
19-
const benchmark = urlParams["benchmark"] ?? null;
20-
const scenario = urlParams["scenario"] ?? null;
21-
const profile = urlParams["profile"] ?? null;
22-
return {
23-
start,
24-
end,
25-
kind,
26-
stat,
27-
benchmark,
28-
scenario,
29-
profile
30-
};
14+
const start = urlParams["start"] ?? "";
15+
const end = urlParams["end"] ?? "";
16+
const kind: GraphKind = urlParams["kind"] as GraphKind ?? "raw";
17+
const stat = urlParams["stat"] ?? "instructions:u";
18+
const benchmark = urlParams["benchmark"] ?? null;
19+
const scenario = urlParams["scenario"] ?? null;
20+
const profile = urlParams["profile"] ?? null;
21+
return {
22+
start,
23+
end,
24+
kind,
25+
stat,
26+
benchmark,
27+
scenario,
28+
profile
29+
};
3130
}
3231
3332
function filterBenchmarks(data: GraphData, filter: (key: string) => boolean): GraphData {
34-
const benchmarks = Object.fromEntries(Object.entries(data.benchmarks)
35-
.filter(([key, _]) => filter(key)));
36-
return {
37-
...data,
38-
benchmarks
39-
};
33+
const benchmarks = Object.fromEntries(Object.entries(data.benchmarks)
34+
.filter(([key, _]) => filter(key)));
35+
return {
36+
...data,
37+
benchmarks
38+
};
4039
}
4140
4241
/*
@@ -45,11 +44,11 @@ function filterBenchmarks(data: GraphData, filter: (key: string) => boolean): Gr
4544
* will not be shown.
4645
*/
4746
function hasSpecificSelection(selector: GraphsSelector): boolean {
48-
return (
49-
selector.benchmark !== null ||
50-
selector.profile !== null ||
51-
selector.scenario !== null
52-
);
47+
return (
48+
selector.benchmark !== null ||
49+
selector.profile !== null ||
50+
selector.scenario !== null
51+
);
5352
}
5453
5554
async function loadGraphData(selector: GraphsSelector, loading: Ref<boolean>) {
@@ -61,42 +60,42 @@ async function loadGraphData(selector: GraphsSelector, loading: Ref<boolean>) {
6160
stat: selector.stat,
6261
benchmark: selector.benchmark,
6362
scenario: selector.scenario,
64-
profile: selector.profile,
63+
profile: selector.profile
6564
};
6665
return await getJson<GraphData>(GRAPH_DATA_URL, params);
6766
});
6867
69-
// Wait for the UI to be updated, which also resets the plot HTML elements.
70-
// Then draw the plots.
71-
await nextTick();
68+
// Wait for the UI to be updated, which also resets the plot HTML elements.
69+
// Then draw the plots.
70+
await nextTick();
7271
73-
// If we select a smaller subset of benchmarks, then just show them.
74-
if (hasSpecificSelection(selector)) {
75-
renderPlots(graphData, selector, "#charts");
76-
} else {
77-
// If we select all of them, we expect that there will be a regular grid.
72+
// If we select a smaller subset of benchmarks, then just show them.
73+
if (hasSpecificSelection(selector)) {
74+
renderPlots(graphData, selector, "#charts");
75+
} else {
76+
// If we select all of them, we expect that there will be a regular grid.
7877
79-
// So, first render everything but the less important benchmarks about artifact sizes.
80-
// This keeps the grouping and alignment of 4 charts per row where all 4 charts are about a
81-
// given benchmark. So, we exclude the benchmarks ending in "-tiny".
82-
const withoutTiny = filterBenchmarks(graphData, (benchName) => !benchName.endsWith("-tiny"));
83-
renderPlots(withoutTiny, selector, "#charts");
78+
// So, first render everything but the less important benchmarks about artifact sizes.
79+
// This keeps the grouping and alignment of 4 charts per row where all 4 charts are about a
80+
// given benchmark. So, we exclude the benchmarks ending in "-tiny".
81+
const withoutTiny = filterBenchmarks(graphData, (benchName) => !benchName.endsWith("-tiny"));
82+
renderPlots(withoutTiny, selector, "#charts");
8483
85-
// Then, render only the size-related ones in their own dedicated section as they are less
86-
// important than having the better grouping. So, we only include the benchmarks ending in
87-
// "-tiny" and render them in the appropriate section.
88-
const onlyTiny = filterBenchmarks(graphData, (benchName) => benchName.endsWith("-tiny"));
89-
renderPlots(onlyTiny, selector, "#size-charts");
90-
}
84+
// Then, render only the size-related ones in their own dedicated section as they are less
85+
// important than having the better grouping. So, we only include the benchmarks ending in
86+
// "-tiny" and render them in the appropriate section.
87+
const onlyTiny = filterBenchmarks(graphData, (benchName) => benchName.endsWith("-tiny"));
88+
renderPlots(onlyTiny, selector, "#size-charts");
89+
}
9190
}
9291
9392
function updateSelection(params: SelectionParams) {
94-
navigateToUrlParams(createUrlParams({
93+
navigateToUrlParams(createUrlWithAppendedParams({
9594
start: params.start,
9695
end: params.end,
9796
kind: params.kind,
9897
stat: params.stat
99-
}));
98+
}).searchParams);
10099
}
101100
102101
const info: BenchmarkInfo = await loadBenchmarkInfo();
@@ -134,9 +133,9 @@ loadGraphData(selector, loading);
134133
</div>
135134
<a href="https://github.com/rust-lang-nursery/rustc-perf">
136135
<img
137-
style="position: absolute; top: 0; right: 0; border: 0; clip-path: polygon(8% 0%, 100% 92%, 100% 0%);"
138-
src="https://camo.githubusercontent.com/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67"
139-
alt="Fork me on GitHub"
140-
data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png">
136+
style="position: absolute; top: 0; right: 0; border: 0; clip-path: polygon(8% 0%, 100% 92%, 100% 0%);"
137+
src="https://camo.githubusercontent.com/38ef81f8aca64bb9a64448d0d70f1308ef5341ab/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6461726b626c75655f3132313632312e706e67"
138+
alt="Fork me on GitHub"
139+
data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png">
141140
</a>
142141
</template>

‎site/frontend/src/utils/navigation.ts

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
export function createUrlParams(params: Dict<string>): URLSearchParams {
2-
return createUrlWithParams(params).searchParams;
3-
}
4-
5-
export function createUrlWithParams(params: Dict<any>): URL {
1+
/**
2+
* Creates a URL with the current window location and current parameters, and adds
3+
* the passed parameters to the URL.
4+
*/
5+
export function createUrlWithAppendedParams(params: Dict<any>): URL {
66
const originalUrl = window.location.toString();
77
const url = new URL(originalUrl);
88
for (const [key, value] of Object.entries(params)) {

0 commit comments

Comments
 (0)