From 1b6d11a2b0c418143349068f63073c102d4df841 Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Wed, 11 Sep 2024 19:10:55 -0600
Subject: [PATCH] Improve image loading by not loading when off screen

---
 web/src/components/camera/CameraImage.tsx   | 1 +
 web/src/components/player/PreviewPlayer.tsx | 1 +
 web/src/pages/Live.tsx                      | 4 ++++
 3 files changed, 6 insertions(+)

diff --git a/web/src/components/camera/CameraImage.tsx b/web/src/components/camera/CameraImage.tsx
index 9f25f69a3..08f3c9126 100644
--- a/web/src/components/camera/CameraImage.tsx
+++ b/web/src/components/camera/CameraImage.tsx
@@ -93,6 +93,7 @@ export default function CameraImage({
             "rounded-lg md:rounded-2xl",
           )}
           onLoad={handleImageLoad}
+          loading="lazy"
         />
       ) : (
         <div className="pt-6 text-center">
diff --git a/web/src/components/player/PreviewPlayer.tsx b/web/src/components/player/PreviewPlayer.tsx
index 6ff5e1590..b233c6ad4 100644
--- a/web/src/components/player/PreviewPlayer.tsx
+++ b/web/src/components/player/PreviewPlayer.tsx
@@ -539,6 +539,7 @@ function PreviewFramesPlayer({
       <img
         ref={imgRef}
         className={`size-full rounded-lg bg-black object-contain md:rounded-2xl`}
+        loading="lazy"
         onLoad={onImageLoaded}
       />
       {previewFrames?.length === 0 && (
diff --git a/web/src/pages/Live.tsx b/web/src/pages/Live.tsx
index c088a5b04..9852852a7 100644
--- a/web/src/pages/Live.tsx
+++ b/web/src/pages/Live.tsx
@@ -29,7 +29,11 @@ function Live() {
       if (group) {
         setCameraGroup(cameraGroup);
       }
+
+      return true;
     }
+
+    return false;
   });
 
   // fullscreen