diff --git a/repl/src/useRepl.mjs b/repl/src/useRepl.mjs
index 061cd2f3..c20a9cba 100644
--- a/repl/src/useRepl.mjs
+++ b/repl/src/useRepl.mjs
@@ -23,6 +23,13 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw }) {
   const dirty = useMemo(() => code !== activeCode || error, [code, activeCode, error]);
   const pushLog = useCallback((message) => setLog((log) => log + `${log ? '\n\n' : ''}${message}`), []);
 
+  // below block allows disabling the highlighting by including "strudel disable-highlighting" in the code (as comment)
+  onDraw = useMemo(() => {
+    if (activeCode && !activeCode.includes('strudel disable-highlighting')) {
+      return onDraw;
+    }
+  }, [activeCode, onDraw]);
+  
   // cycle hook to control scheduling
   const cycle = useCycle({
     onDraw,
@@ -111,13 +118,6 @@ function useRepl({ tune, defaultSynth, autolink = true, onEvent, onDraw }) {
     }
   };
 
-  // below block allows disabling the highlighting by including "strudel disable-highlighting" in the code (as comment)
-  onDraw = useMemo(() => {
-    if (activeCode && !activeCode.includes('strudel disable-highlighting')) {
-      return onDraw;
-    }
-  }, [activeCode, onDraw]);
-
   const togglePlay = () => {
     if (!cycle.started) {
       activateCode();