fix: Optimize CurveEditor drag performance with requestAnimationFrame batching (#9114)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/composables/useCurveEditor.ts

@@ -102,8 +102,13 @@ export function useCurveEditor({ svgRef, modelValue }: UseCurveEditorOptions) {
 
     svg.setPointerCapture(e.pointerId)
 
-    const onMove = (ev: PointerEvent) => {
-      if (dragIndex.value < 0) return
+    let rafId: number | null = null
+    let latestPointerEvent: PointerEvent | null = null
+
+    const applyMove = () => {
+      rafId = null
+      const ev = latestPointerEvent
+      if (!ev || dragIndex.value < 0) return
       const [x, y] = svgCoords(ev)
       const movedPoint: CurvePoint = [x, y]
       const newPoints = [...modelValue.value]
@@ -113,7 +118,20 @@ export function useCurveEditor({ svgRef, modelValue }: UseCurveEditorOptions) {
       dragIndex.value = newPoints.indexOf(movedPoint)
     }
 
+    const onMove = (ev: PointerEvent) => {
+      if (dragIndex.value < 0) return
+      latestPointerEvent = ev
+      if (rafId === null) {
+        rafId = requestAnimationFrame(applyMove)
+      }
+    }
+
     const endDrag = () => {
+      if (rafId !== null) {
+        cancelAnimationFrame(rafId)
+        rafId = null
+        applyMove()
+      }
       if (dragIndex.value < 0) return
       dragIndex.value = -1
       svg.removeEventListener('pointermove', onMove)

src/scripts/changeTracker.ts

@@ -17,7 +17,10 @@ import { useSubgraphNavigationStore } from '@/stores/subgraphNavigationStore'
 import { api } from './api'
 import type { ComfyApp } from './app'
 import { app } from './app'
-import { clone } from './utils'
+
+function clone<T>(obj: T): T {
+  return JSON.parse(JSON.stringify(obj))
+}
 
 const logger = log.getLogger('ChangeTracker')
 // Change to debug for more verbose logging