From af6fb75e6b7432e74c35c36d41e38f9eddda0571 Mon Sep 17 00:00:00 2001
From: ajnart <thomas@ajnart.fr>
Date: Wed, 12 Aug 2026 12:20:34 +0200
Subject: [PATCH] perf: trim widget loading work

---
 packages/widgets/src/beszel/_shared/chart.tsx   | 2 +-
 packages/widgets/src/iframe/component.tsx       | 1 +
 packages/widgets/src/rssFeed/component.tsx      | 1 +
 packages/widgets/src/system-disks/component.tsx | 3 ++-
 4 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/packages/widgets/src/beszel/_shared/chart.tsx b/packages/widgets/src/beszel/_shared/chart.tsx
index 73601b7b6..0c32e9b2a 100644
--- a/packages/widgets/src/beszel/_shared/chart.tsx
+++ b/packages/widgets/src/beszel/_shared/chart.tsx
@@ -31,7 +31,7 @@ function prepareRecords<T>(records: T[], timePeriod: BeszelTimePeriod, locale: s
   if (timePeriod === "1m") {
     return { fmt, ordered: records };
   }
-  return { fmt, ordered: [...records].toReversed() };
+  return { fmt, ordered: records.toReversed() };
 }
 
 function padTimeGrid(data: Record<string, unknown>[], timePeriod: BeszelTimePeriod, locale: string) {
diff --git a/packages/widgets/src/iframe/component.tsx b/packages/widgets/src/iframe/component.tsx
index 7dce2c91b..fe1e1daa7 100644
--- a/packages/widgets/src/iframe/component.tsx
+++ b/packages/widgets/src/iframe/component.tsx
@@ -26,6 +26,7 @@ export default function IFrameWidget({ options, isEditMode }: WidgetComponentPro
     <Stack h="100%" w="100%" gap={0}>
       <Box style={{ flex: 1, minHeight: 0 }}>
         <iframe
+          loading="lazy"
           style={isEditMode ? { userSelect: "none", pointerEvents: "none" } : undefined}
           className={classes.iframe}
           src={safeEmbedUrl}
diff --git a/packages/widgets/src/rssFeed/component.tsx b/packages/widgets/src/rssFeed/component.tsx
index db8a31641..0da60d804 100644
--- a/packages/widgets/src/rssFeed/component.tsx
+++ b/packages/widgets/src/rssFeed/component.tsx
@@ -126,6 +126,7 @@ export default function RssFeed({ options, width, height, displayMode }: WidgetC
               <Group wrap="nowrap" align="flex-start" gap={isDense ? "xs" : "md"}>
                 {feedEntry.enclosure !== undefined && entryDisplay.showImage && (
                   <Image
+                    loading="lazy"
                     className={classes.poster}
                     src={feedEntry.enclosure}
                     alt=""
diff --git a/packages/widgets/src/system-disks/component.tsx b/packages/widgets/src/system-disks/component.tsx
index f9b8cac37..e320bd2e4 100644
--- a/packages/widgets/src/system-disks/component.tsx
+++ b/packages/widgets/src/system-disks/component.tsx
@@ -104,8 +104,9 @@ const SystemDiskCard = ({
     measure();
     const observer = new ResizeObserver(measure);
     observer.observe(card);
+    observer.observe(value);
     return () => observer.disconnect();
-  }, [displayText, healthy]);
+  }, []);
 
   const unhealthyLabel = t("widget.systemDisks.status.unhealthy");
   const hasTemperature = temperature !== null && temperature !== undefined;