⚡ Bolt: [성능 최적화] GrooveMap 최대 시간 계산 최적화

.jules/bolt.md

@@ -61,3 +61,7 @@
 ## 2026-07-13 - Array.from mapping optimization
 **Learning:** Using `Array.from({ length: N }).map(...)` creates an intermediate array of `undefined` values which requires memory allocation and garbage collection, adding O(N) unnecessary overhead in frequently re-rendered UI components.
 **Action:** Use `Array.from({ length: N }, (_, index) => ...)` to map elements directly during array creation, avoiding intermediate allocations.
+
+## 2026-07-14 - Replace reduce with for loop for max calculation
+**Learning:** Using `reduce()` with a callback function for simple iterations like finding a maximum adds significant overhead due to repeated function calls compared to a standard native loop.
+**Action:** Replace `array.reduce()` with a simple `for` loop in performance-sensitive React renders for O(1) allocation overhead and faster execution times.

apps/desktop/src/features/workspace/GrooveMap.tsx

@@ -17,7 +17,14 @@ function GrooveMapComponent({ notes, isLoading }: GrooveMapProps) {
 
   // Find max offset to determine timeline width
   const maxTime = useMemo(() => {
-    return renderedNotes.reduce((max, n) => Math.max(max, n.offset), 10);
+    // Performance: Avoid O(N) overhead of .reduce() callback allocations
+    let max = 10;
+    for (let i = 0; i < renderedNotes.length; i++) {
+      if (renderedNotes[i].offset > max) {
+        max = renderedNotes[i].offset;
+      }
+    }
+    return max;
   }, [renderedNotes]);
 
   // Unique pitches to determine vertical lanes (avoiding 88-key piano roll)