From b3857c6d9ae43c28594246ab4ece1f46c89c4181 Mon Sep 17 00:00:00 2001
From: dakkar <dakkar@thenautilus.net>
Date: Mon, 28 Jul 2025 15:53:16 +0100
Subject: [PATCH 1/2] remove mousemove callback when there's no longer a cat

---
 packages/frontend/src/components/SkOneko.vue | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/packages/frontend/src/components/SkOneko.vue b/packages/frontend/src/components/SkOneko.vue
index 07c15d4304..7e12bcac08 100644
--- a/packages/frontend/src/components/SkOneko.vue
+++ b/packages/frontend/src/components/SkOneko.vue
@@ -13,7 +13,7 @@ Displays Oneko, a cat that follows the cursor.
 // oneko.js: https://github.com/adryd325/oneko.js
 // modified to be a vue component by ShittyKopper :3
 
-import { shallowRef, onMounted } from 'vue';
+import { shallowRef, onMounted, onUnmounted } from 'vue';
 
 const nekoEl = shallowRef<HTMLDivElement>();
 
@@ -93,21 +93,26 @@ const spriteSets = {
 	],
 };
 
+function mouseCallback(event) {
+	mousePosX = event.clientX;
+	mousePosY = event.clientY;
+}
+
 function init() {
 	if (!nekoEl.value) return;
 
 	nekoEl.value.style.left = `${nekoPosX - 16}px`;
 	nekoEl.value.style.top = `${nekoPosY - 16}px`;
 
-	// TODO this causes a memory leak because it never gets unbound
-	window.document.addEventListener('mousemove', (event) => {
-		mousePosX = event.clientX;
-		mousePosY = event.clientY;
-	});
+	window.document.addEventListener('mousemove', mouseCallback);
 
 	window.requestAnimationFrame(onAnimationFrame);
 }
 
+function uninit() {
+	window.removeEventListener('mousemove', mouseCallback);
+}
+
 function onAnimationFrame(timestamp) {
 	// Stops execution if the neko element is removed from DOM
 	if (!nekoEl.value?.isConnected) {
@@ -232,6 +237,7 @@ function frame() {
 }
 
 onMounted(init);
+onUnmounted(uninit);
 </script>
 
 <style module>

From 2b083287a5eb31e90cd5183ea797ab3fd6afdb20 Mon Sep 17 00:00:00 2001
From: dakkar <dakkar@thenautilus.net>
Date: Mon, 28 Jul 2025 15:55:36 +0100
Subject: [PATCH 2/2] mark the callback as "passive", should improve
 performance

see https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#using_passive_listeners
---
 packages/frontend/src/components/SkOneko.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/frontend/src/components/SkOneko.vue b/packages/frontend/src/components/SkOneko.vue
index 7e12bcac08..b8f6a78d8b 100644
--- a/packages/frontend/src/components/SkOneko.vue
+++ b/packages/frontend/src/components/SkOneko.vue
@@ -104,13 +104,13 @@ function init() {
 	nekoEl.value.style.left = `${nekoPosX - 16}px`;
 	nekoEl.value.style.top = `${nekoPosY - 16}px`;
 
-	window.document.addEventListener('mousemove', mouseCallback);
+	window.document.addEventListener('mousemove', mouseCallback, { passive: true });
 
 	window.requestAnimationFrame(onAnimationFrame);
 }
 
 function uninit() {
-	window.removeEventListener('mousemove', mouseCallback);
+	window.removeEventListener('mousemove', mouseCallback, { passive: true });
 }
 
 function onAnimationFrame(timestamp) {