refactor: zoom 기능 사용 시 렌더링 성능 개선 (#203)

refactor: zoom 기능 사용 시 렌더링 성능 최적화
boostcampwm-2024 · Dec 3, 2024 · d831bcc · d831bcc
1 parent cbd1cd1
commit d831bcc
Showing 1 changed file with 2 additions and 12 deletions.
diff --git a/packages/frontend/src/hooks/useZoomSpace.ts b/packages/frontend/src/hooks/useZoomSpace.ts
@@ -46,8 +46,6 @@ export function useZoomSpace({
   minScale = 0.5,
   maxScale = 2.5,
 }: UseZoomSpaceProps) {
-  const animationFrameId = useRef<number | null>(null);
-
   const zoomSpace = (event: KonvaEventObject<WheelEvent>) => {
     event.evt.preventDefault();
 
@@ -80,16 +78,8 @@ export function useZoomSpace({
       }
 
       const newPosition = calculateNewPosition(pointer, mousePointTo, newScale);
-
-      if (animationFrameId.current) {
-        cancelAnimationFrame(animationFrameId.current);
-      }
-
-      animationFrameId.current = requestAnimationFrame(() => {
-        stage.scale({ x: newScale, y: newScale });
-        stage.position(newPosition);
-        stage.batchDraw();
-      });
+      stage.scale({ x: newScale, y: newScale });
+      stage.position(newPosition);
     }
   };