diff --git a/WGLMakie/Project.toml b/WGLMakie/Project.toml
index 1ed2b9b9cfd..001b3f58c59 100644
--- a/WGLMakie/Project.toml
+++ b/WGLMakie/Project.toml
@@ -20,7 +20,7 @@ ShaderAbstractions = "65257c39-d410-5151-9873-9b3e5be5013e"
 StaticArrays = "90137ffa-7385-5640-81b9-e52037218182"
 
 [compat]
-Bonito = "3.0.0"
+Bonito = "3.1.2"
 Colors = "0.11, 0.12"
 FileIO = "1.1"
 FreeTypeAbstraction = "0.10"
diff --git a/WGLMakie/src/wglmakie.bundled.js b/WGLMakie/src/wglmakie.bundled.js
index c9b67a26aa1..c810b296375 100644
--- a/WGLMakie/src/wglmakie.bundled.js
+++ b/WGLMakie/src/wglmakie.bundled.js
@@ -22773,24 +22773,6 @@ function start_renderloop(three_scene) {
     render_scene(three_scene);
     renderloop();
 }
-function throttle_function(func, delay) {
-    let prev = 0;
-    let future_id = undefined;
-    function inner_throttle(...args) {
-        const now = new Date().getTime();
-        if (future_id !== undefined) {
-            clearTimeout(future_id);
-            future_id = undefined;
-        }
-        if (now - prev > delay) {
-            prev = now;
-            return func(...args);
-        } else {
-            future_id = setTimeout(()=>inner_throttle(...args), now - prev + 1);
-        }
-    }
-    return inner_throttle;
-}
 function get_body_size() {
     const bodyStyle = window.getComputedStyle(document.body);
     const width_padding = parseInt(bodyStyle.paddingLeft, 10) + parseInt(bodyStyle.paddingRight, 10) + parseInt(bodyStyle.marginLeft, 10) + parseInt(bodyStyle.marginRight, 10);
@@ -22870,7 +22852,7 @@ function add_canvas_events(screen, comm, resize_to) {
             ]
         });
     }
-    const notify_mouse_throttled = throttle_function(mouse_callback, 40);
+    const notify_mouse_throttled = Bonito.throttle_function(mouse_callback, 40);
     function mousemove(event) {
         notify_mouse_throttled(event);
         return false;
@@ -22960,7 +22942,7 @@ function add_canvas_events(screen, comm, resize_to) {
         }
     }
     if (resize_to) {
-        const resize_callback_throttled = throttle_function(resize_callback, 100);
+        const resize_callback_throttled = Bonito.throttle_function(resize_callback, 100);
         window.addEventListener("resize", (event)=>resize_callback_throttled());
         setTimeout(resize_callback, 50);
     }
diff --git a/WGLMakie/src/wglmakie.js b/WGLMakie/src/wglmakie.js
index ed4dd7335db..5c4265dba9c 100644
--- a/WGLMakie/src/wglmakie.js
+++ b/WGLMakie/src/wglmakie.js
@@ -84,45 +84,6 @@ function start_renderloop(three_scene) {
     renderloop();
 }
 
-// from: https://www.geeksforgeeks.org/javascript-throttling/
-function throttle_function(func, delay) {
-    // Previously called time of the function
-    let prev = 0;
-    // ID of queued future update
-    let future_id = undefined;
-    function inner_throttle(...args) {
-        // Current called time of the function
-        const now = new Date().getTime();
-
-        // If we had a queued run, clear it now, we're
-        // either going to execute now, or queue a new run.
-        if (future_id !== undefined) {
-            clearTimeout(future_id);
-            future_id = undefined;
-        }
-
-        // If difference is greater than delay call
-        // the function again.
-        if (now - prev > delay) {
-            prev = now;
-            // "..." is the spread operator here
-            // returning the function with the
-            // array of arguments
-            return func(...args);
-        } else {
-            // Otherwise, we want to queue this function call
-            // to occur at some later later time, so that it
-            // does not get lost; we'll schedule it so that it
-            // fires just a bit after our choke ends.
-            future_id = setTimeout(
-                () => inner_throttle(...args),
-                now - prev + 1
-            );
-        }
-    }
-    return inner_throttle;
-}
-
 function get_body_size() {
     const bodyStyle = window.getComputedStyle(document.body);
     // Subtract padding that is added by VSCode
@@ -239,7 +200,7 @@ function add_canvas_events(screen, comm, resize_to) {
         comm.notify({ mouseposition: [x, y] });
     }
 
-    const notify_mouse_throttled = throttle_function(mouse_callback, 40);
+    const notify_mouse_throttled = Bonito.throttle_function(mouse_callback, 40);
 
     function mousemove(event) {
         notify_mouse_throttled(event);
@@ -338,7 +299,7 @@ function add_canvas_events(screen, comm, resize_to) {
         }
     }
     if (resize_to) {
-        const resize_callback_throttled = throttle_function(
+        const resize_callback_throttled = Bonito.throttle_function(
             resize_callback,
             100
         );