danvics/zerobyte
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

fix: lazy load repository stats on-demand

Browse source 
The repositories page was eagerly fetching restic stats on every page load,
which causes high CPU/Memory usage for large repositories (especially multi-TB
Backblaze repos). This fix removes the eager loading from the route loader,
so stats are now fetched on-demand by the frontend component instead.

This resolves the issue where:
- Loading the repository page would trigger restic stats immediately
- Refreshing the page would trigger additional calls to restic stats
- Resource consumption would ramp up significantly

Fixes #614
This commit is contained in:
theluckystrike 2026-03-04 22:01:54 +07:00
parent fb3c5b33c0
commit 3484d063c8
1 changed files with 2 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
app/routes/(dashboard)/repositories/$repositoryId/index.tsx
View file

@ -2,7 +2,6 @@ import { createFileRoute } from "@tanstack/react-router";
import { type } from "arktype";
import {
getRepositoryOptions,
getRepositoryStatsOptions,
listBackupSchedulesOptions,
listSnapshotsOptions,
} from "~/client/api-client/@tanstack/react-query.gen";
@ -14,20 +13,17 @@ export const Route = createFileRoute("/(dashboard)/repositories/$repositoryId/")
errorComponent: (e) => <div>{e.error.message}</div>,
loader: async ({ params, context }) => {
const snapshotOptions = listSnapshotsOptions({ path: { shortId: params.repositoryId } });
const statsOptions = getRepositoryStatsOptions({ path: { shortId: params.repositoryId } });
const [res, schedules] = await Promise.all([
const [res, schedules, snapshots] = await Promise.all([
context.queryClient.ensureQueryData(getRepositoryOptions({ path: { shortId: params.repositoryId } })),
context.queryClient.ensureQueryData(listBackupSchedulesOptions()),
prefetchOrSkip(context.queryClient, snapshotOptions),
prefetchOrSkip(context.queryClient, statsOptions),
]);
return {
...res,
snapshots: context.queryClient.getQueryData(snapshotOptions.queryKey),
backupSchedules: schedules,
stats: context.queryClient.getQueryData(statsOptions.queryKey),
};
},
validateSearch: type({ tab: "string?" }),
@ -50,14 +46,13 @@ export const Route = createFileRoute("/(dashboard)/repositories/$repositoryId/")
function RouteComponent() {
const { repositoryId } = Route.useParams();
const { snapshots, backupSchedules, stats } = Route.useLoaderData();
const { snapshots, backupSchedules } = Route.useLoaderData();
return (
<RepositoryDetailsPage
repositoryId={repositoryId}
initialSnapshots={snapshots}
initialBackupSchedules={backupSchedules}
initialStats={stats}
/>
);
}