diff --git a/frontend/src/components/TasksLayout.tsx b/frontend/src/components/TasksLayout.tsx index 034aa6911..e2f94a027 100644 --- a/frontend/src/components/TasksLayout.tsx +++ b/frontend/src/components/TasksLayout.tsx @@ -367,7 +367,28 @@ export function TasksLayout() { ), [currentColumns, tasksByStatus, taskSearch, priorityFilter, setSelectedTaskId, setViewMode]); + + // ⚑ Bolt: Wrap My Tasks list in useMemo to prevent O(N) re-renders + // 🎯 Why: Mapping over potentially large lists of filtered tasks blocks the main thread during unrelated state updates. + const myTasksList = useMemo(() => { + if (viewMode !== 'λ‚΄ μž‘μ—…') return null; + return filteredTicketTasks.length > 0 ? filteredTicketTasks.map(task => ( + + )) : ( +

μ„œλͺ… μ„Έμ…˜μ— μ—°κ²°λœ λ‚΄ μž‘μ—…μ΄ μ—†μŠ΅λ‹ˆλ‹€.

+ ); + }, [filteredTicketTasks, setSelectedTaskId, setViewMode, viewMode]); const handleViewModeKeyDown = (event: KeyboardEvent, mode: TaskViewMode) => { + const currentIndex = TASK_VIEW_MODES.indexOf(mode); const lastIndex = TASK_VIEW_MODES.length - 1; let nextIndex: number; @@ -684,20 +705,7 @@ export function TasksLayout() { {viewMode === 'λ‚΄ μž‘μ—…' && (

λ‚΄ μž‘μ—…

- {filteredTicketTasks.length > 0 ? filteredTicketTasks.map(task => ( - - )) : ( -

μ„œλͺ… μ„Έμ…˜μ— μ—°κ²°λœ λ‚΄ μž‘μ—…μ΄ μ—†μŠ΅λ‹ˆλ‹€.

- )} + {myTasksList}
)}