Optimize scroll handling in App.tsx

src/App.tsx

@@ -437,12 +437,25 @@ export default function App() {
     visibleRange.start
   ]);
 
-  const handleTextareaScroll = useCallback((event: React.UIEvent<HTMLTextAreaElement>) => {
+  const scheduleUpdateVisibleRange = useCallback(() => {
-    if (!showLineNumbersActive) return;
+    if (scrollRafRef.current) {
-    if (lineNumbersRef.current) {
+      cancelAnimationFrame(scrollRafRef.current);
-      lineNumbersRef.current.scrollTop = event.currentTarget.scrollTop;
     }
-  }, [showLineNumbersActive]);
+    scrollRafRef.current = requestAnimationFrame(() => {
+      updateVisibleRange();
+    });
+  }, [updateVisibleRange]);
+
+  const handleTextareaScroll = useCallback(
+    (event: React.UIEvent<HTMLTextAreaElement>) => {
+      if (!showLineNumbersActive) return;
+      if (lineNumbersRef.current) {
+        lineNumbersRef.current.scrollTop = event.currentTarget.scrollTop;
+      }
+      scheduleUpdateVisibleRange();
+    },
+    [scheduleUpdateVisibleRange, showLineNumbersActive]
+  );
 
   useEffect(() => {
     if (!showLineNumbersActive) return;