web: refactor gpu code for slighly better perf

internal/site/src/components/routes/system.tsx

@@ -400,16 +400,34 @@ export default memo(function SystemDetail({ id }: { id: string }) {
 	const containerFilterBar = containerData.length ? <FilterBar /> : null
 
 	const dataEmpty = !chartLoading && chartData.systemStats.length === 0
-	const lastGpuVals = Object.values(systemStats.at(-1)?.stats.g ?? {})
-	const hasGpuData = lastGpuVals.length > 0
-	const hasGpuPowerData = systemStats.some((record) => {
-		const gpus = record.stats?.g
-		if (!gpus) {
-			return false
+	const lastGpus = systemStats.at(-1)?.stats?.g
+
+	let hasGpuData = false
+	let hasGpuEnginesData = false
+	let hasGpuPowerData = false
+
+	if (lastGpus) {
+		// check if there are any GPUs with engines
+		for (const id in lastGpus) {
+			hasGpuData = true
+			if (lastGpus[id].e !== undefined) {
+				hasGpuEnginesData = true
+				break
 			}
-		return Object.values(gpus).some((gpu) => gpu.p !== undefined || gpu.pp !== undefined)
-	})
-	const hasGpuEnginesData = lastGpuVals.some((gpu) => gpu.e !== undefined)
+		}
+		// check if there are any GPUs with power data
+		for (let i = 0; i < systemStats.length && !hasGpuPowerData; i++) {
+			const gpus = systemStats[i].stats?.g
+			if (!gpus) continue
+			for (const id in gpus) {
+				if (gpus[id].p !== undefined || gpus[id].pp !== undefined) {
+					hasGpuPowerData = true
+					break
+				}
+			}
+		}
+	}
+
 	const isLinux = !(details?.os ?? system.info?.os)
 	const isPodman = details?.podman ?? system.info?.p ?? false
 
@@ -721,8 +739,9 @@ export default memo(function SystemDetail({ id }: { id: string }) {
 								<GpuEnginesChart chartData={chartData} />
 							</ChartCard>
 						)}
-						{Object.keys(systemStats.at(-1)?.stats.g ?? {}).map((id) => {
-							const gpu = systemStats.at(-1)?.stats.g?.[id] as GPUData
+						{lastGpus &&
+							Object.keys(lastGpus).map((id) => {
+								const gpu = lastGpus[id] as GPUData
 								return (
 									<div key={id} className="contents">
 										<ChartCard