Fixes #14: Lazy load additional metrics

This commit is contained in:
Lou Knauer 2022-07-08 12:23:24 +02:00
parent 9198d160a1
commit 772d37b093
3 changed files with 30 additions and 12 deletions

View File

@ -49,6 +49,8 @@ All security relevant configuration. e.g., keys and passwords, are set using env
- `plot_view_showStatTable`: Type bool. Option to toggle the node statistic table in single job view. Default `true`. - `plot_view_showStatTable`: Type bool. Option to toggle the node statistic table in single job view. Default `true`.
- `system_view_selectedMetric`: Type string. Initial metric shown in system view. Default `cpu_load`. - `system_view_selectedMetric`: Type string. Initial metric shown in system view. Default `cpu_load`.
Some of the `ui-defaults` values can be appended by `:<clustername>` in order to have different settings depending on the current cluster. Those are notably `job_view_nodestats_selectedMetrics`, `job_view_polarPlotMetrics`, `job_view_selectedMetrics` and `plot_list_selectedMetrics`.
## Environment Variables ## Environment Variables
An example env file is found in this directory. Copy it to `.env` in the project root and adapt it for your needs. An example env file is found in this directory. Copy it to `.env` in the project root and adapt it for your needs.

View File

@ -31,26 +31,42 @@
const ccconfig = getContext('cc-config'), const ccconfig = getContext('cc-config'),
clusters = getContext('clusters') clusters = getContext('clusters')
let isMetricsSelectionOpen = false, selectedMetrics = [] let isMetricsSelectionOpen = false, selectedMetrics = [], isFetched = new Set()
const [jobMetrics, startFetching] = fetchMetricsStore() const [jobMetrics, startFetching] = fetchMetricsStore()
getContext('on-init')(() => { getContext('on-init')(() => {
let job = $initq.data.job let job = $initq.data.job
if (!job) if (!job)
return return
startFetching(job, null, job.numNodes > 2 ? ["node"] : ["node", "core"])
// TODO: Do not even fetch metrics that are not one of the following: flops_any, mem_bw, job_view_selectedMetrics, job_view_nodestats_selectedMetrics
selectedMetrics = ccconfig[`job_view_selectedMetrics:${job.cluster}`] selectedMetrics = ccconfig[`job_view_selectedMetrics:${job.cluster}`]
|| clusters.find(c => c.name == job.cluster).metricConfig.map(mc => mc.name) || clusters.find(c => c.name == job.cluster).metricConfig.map(mc => mc.name)
let toFetch = new Set([
'flops_any', 'mem_bw',
...selectedMetrics,
...(ccconfig[`job_view_polarPlotMetrics:${job.cluster}`] || ccconfig[`job_view_polarPlotMetrics`]),
...(ccconfig[`job_view_nodestats_selectedMetrics:${job.cluster}`] || ccconfig[`job_view_nodestats_selectedMetrics`])])
// selectedMetrics = ccconfig[`job_view_selectedMetrics:${job.cluster}`] startFetching(job, [...toFetch], job.numNodes > 2 ? ["node"] : ["node", "core"])
// || clusters.find(c => c.name == job.cluster).metricConfig.map(mc => mc.name) isFetched = toFetch
// let toFetch = new Set(['flops_any', 'mem_bw', ])
}) })
const lazyFetchMoreMetrics = () => {
let notYetFetched = new Set()
for (let m of selectedMetrics) {
if (!isFetched.has(m)) {
notYetFetched.add(m)
isFetched.add(m)
}
}
if (notYetFetched.size > 0)
startFetching($initq.data.job, [...notYetFetched], $initq.data.job.numNodes > 2 ? ["node"] : ["node", "core"])
}
// Fetch more data once required:
$: if ($initq.data && $jobMetrics.data && selectedMetrics) lazyFetchMoreMetrics();
let plots = {}, jobTags, fullWidth, statsTable let plots = {}, jobTags, fullWidth, statsTable
$: polarPlotSize = Math.min(fullWidth / 3 - 10, 300) $: polarPlotSize = Math.min(fullWidth / 3 - 10, 300)
$: document.title = $initq.fetching ? 'Loading...' : ($initq.error ? 'Error' : `Job ${$initq.data.job.jobId} - ClusterCockpit`) $: document.title = $initq.fetching ? 'Loading...' : ($initq.error ? 'Error' : `Job ${$initq.data.job.jobId} - ClusterCockpit`)
@ -88,7 +104,7 @@
<Col> <Col>
<PolarPlot <PolarPlot
width={polarPlotSize} height={polarPlotSize} width={polarPlotSize} height={polarPlotSize}
metrics={ccconfig[`job_view_polarPlotMetrics:${$initq.data.job.cluster}`] || ccconfig.job_view_polarPlotMetrics} metrics={ccconfig[`job_view_polarPlotMetrics:${$initq.data.job.cluster}`] || ccconfig[`job_view_polarPlotMetrics`]}
cluster={$initq.data.job.cluster} cluster={$initq.data.job.cluster}
jobMetrics={$jobMetrics.data.jobMetrics} /> jobMetrics={$jobMetrics.data.jobMetrics} />
</Col> </Col>

View File

@ -12,7 +12,7 @@
export let padding = 10 export let padding = 10
let tableWidth = 0 let tableWidth = 0
const PLACEHOLDER = { magic: 'object' } const isPlaceholder = x => x._is_placeholder === true
function tile(items, itemsPerRow) { function tile(items, itemsPerRow) {
const rows = [] const rows = []
@ -22,7 +22,7 @@
if (ri + ci < items.length) if (ri + ci < items.length)
row.push(items[ri + ci]) row.push(items[ri + ci])
else else
row.push(PLACEHOLDER) row.push({ _is_placeholder: true, ri, ci })
} }
rows.push(row) rows.push(row)
@ -40,7 +40,7 @@
<tr> <tr>
{#each row as item (item)} {#each row as item (item)}
<td> <td>
{#if item != PLACEHOLDER && plotWidth > 0} {#if !isPlaceholder(item) && plotWidth > 0}
<slot item={item} width={plotWidth}></slot> <slot item={item} width={plotWidth}></slot>
{/if} {/if}
</td> </td>