components/AnimatedBackground.vue

@@ -109,9 +109,10 @@ async function main(canvas: HTMLCanvasElement, fragmentShader2: string) {
             0,     // offset
             6,     // num vertices to process
         );
+        interval.value = setTimeout(() => requestAnimationFrame(render), targetFramerate)
     }
-    clearInterval(interval.value)
-    interval.value = setInterval(() => requestAnimationFrame(render), targetFramerate)
+    clearTimeout(interval.value)
+    requestAnimationFrame(render)
 }
 
 
@@ -119,7 +120,6 @@ async function reloadShader() {
     nextTick(() => {
         if (!canvas.value) { return }
         let fragmentShader2 = fragmentShader.replace("#define FBM_OCTAVES 6", "#define FBM_OCTAVES " + settingsStore.shaderQuality);
-        clearInterval(interval.value)
         main(canvas.value, fragmentShader2);
     })