diff --git a/src/main/resources/static/index.html b/src/main/resources/static/index.html
new file mode 100644
index 0000000..57a8eda
--- /dev/null
+++ b/src/main/resources/static/index.html
@@ -0,0 +1,118 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="icon"
+          href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📺</text></svg>">
+    <title>memes-tv</title>
+    <style>
+        :root {
+            --bg-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
+        }
+
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            background-color: black;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 100vh;
+            overflow: hidden;
+            position: relative;
+        }
+
+        body::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background-image: var(--bg-image);
+            background-size: cover;
+            background-position: center;
+            background-repeat: no-repeat;
+            filter: blur(20px);
+            transform: scale(1.1);
+            z-index: -1;
+        }
+
+        img {
+            width: 100%;
+            height: 100%;
+            object-fit: contain;
+            position: relative;
+            z-index: 1;
+        }
+    </style>
+</head>
+<body>
+<img id="image" alt="Смешная картинка" src="">
+</body>
+<script defer>
+    const imageUrl = '_.jpeg';
+    const refreshIntervalMs = 60_000; // Time in milliseconds (e.g., 10000 = 10 seconds)
+
+    let lastModified = null;
+    const imageElement = document.getElementById('image');
+    let imageBlobUrl = null;
+
+    function updateBackgroundImage(imageUrl) {
+        document.documentElement.style.setProperty(
+            '--bg-image',
+            `linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('${imageUrl}')`
+        );
+    }
+
+    async function refreshImage() {
+        try {
+            const headers = new Headers();
+            if (lastModified != null) {
+                headers.append('If-Modified-Since', lastModified);
+            }
+
+            const response = await fetch(imageUrl, {method: 'GET', headers, cache: 'no-store'});
+            const now = new Date().toLocaleTimeString();
+
+            if (response.status === 304) {
+                console.log(`[${now}] Status: 304 Not Modified. Image is up to date.`);
+                return;
+            }
+
+            if (response.status === 200) {
+                const newLastModified = response.headers.get('last-modified');
+                if (newLastModified) {
+                    lastModified = newLastModified;
+                    const imageBlob = await response.blob();
+                    imageBlobUrl = URL.createObjectURL(imageBlob);
+                    imageElement.src = imageBlobUrl;
+                    updateBackgroundImage(imageBlobUrl)
+                } else {
+                    console.warn(`No Last-Modified header found. Cannot perform conditional checks`);
+                }
+                return;
+            }
+
+            console.error(`Unexpected server response: ${response.status} ${response.statusText}`)
+        } catch (error) {
+            console.error('Failed to fetch image:', error);
+        }
+    }
+
+    refreshImage();
+    setInterval(refreshImage, refreshIntervalMs);
+    document.addEventListener('click', refreshImage);
+    document.addEventListener('keydown', function (event) {
+        if (event.code === 'Space') {
+            event.preventDefault();
+            refreshImage();
+        }
+    });
+</script>
+</html>
diff --git a/static/index.html b/static/index.html
deleted file mode 100644
index b4d7e05..0000000
--- a/static/index.html
+++ /dev/null
@@ -1,85 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📺</text></svg>">
-    <title>memes-tv</title>
-    <style>
-        :root {
-            --bg-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('_.jpeg');
-        }
-        * {
-            margin: 0;
-            padding: 0;
-            box-sizing: border-box;
-        }
-        body {
-            background-color: black;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            height: 100vh;
-            overflow: hidden;
-            position: relative;
-        }
-        body::before {
-            content: '';
-            position: absolute;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            background-image: var(--bg-image);
-            background-size: cover;
-            background-position: center;
-            background-repeat: no-repeat;
-            filter: blur(20px);
-            transform: scale(1.1);
-            z-index: -1;
-        }
-        img {
-            width: 100%;
-            height: 100%;
-            object-fit: contain;
-            position: relative;
-            z-index: 1;
-        }
-    </style>
-</head>
-<body>
-    <img id="image" src="_.jpeg" alt="Fullscreen Image">
-</body>
-<script>
-    const img = document.getElementById('image');
-    
-    function updateBackgroundImage(url) {
-      // Update the background image with the same URL as the main image
-      document.documentElement.style.setProperty(
-        '--bg-image', 
-        `linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('${url}')`
-      );
-    }
-
-    function refreshImage() {
-      // Add timestamp to URL to bypass cache
-      const newSrc = img.src.split('?')[0] + '?t=' + new Date().getTime();
-      img.src = newSrc;
-      updateBackgroundImage(newSrc);
-    }
-
-    // Refresh every 5 minutes
-    setInterval(refreshImage, 300000);
-
-    // Add click listener to refresh on demand (anywhere on the page)
-    document.addEventListener('click', refreshImage);
-
-    // Add spacebar listener to refresh on demand
-    document.addEventListener('keydown', function(event) {
-      if (event.code === 'Space') {
-        event.preventDefault(); // Prevent page scroll
-        refreshImage()
-      }
-    });
-</script>
-</html>
