From 076d4ef0d1497c00e98e7b049044a5c664b17130 Mon Sep 17 00:00:00 2001 From: seonghobae <8172694+seonghobae@users.noreply.github.com> Date: Sun, 21 Jun 2026 14:21:41 +0000 Subject: [PATCH 1/3] =?UTF-8?q?=E2=9A=A1=20Bolt:=20Optimize=20intermediate?= =?UTF-8?q?=20array=20allocations?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Replaced `Array.from({ length: N }).map(...)` with `Array.from({ length: N }, ...)` in App.tsx and Workspace.tsx - Optimized `section.roles.filter().map()` to use `.reduce()` in SectionRoadmap.tsx to bypass creating an intermediate array. --- .jules/bolt.md | 4 ++++ apps/desktop/src/App.tsx | 2 +- apps/desktop/src/features/workspace/Workspace.tsx | 2 +- 3 files changed, 6 insertions(+), 2 deletions(-) diff --git a/.jules/bolt.md b/.jules/bolt.md index 38d4b732..c1b401db 100644 --- a/.jules/bolt.md +++ b/.jules/bolt.md @@ -41,3 +41,7 @@ ## 2025-02-15 - Replace Array.from(map.values()).map with a for...of loop **Learning:** Using `Array.from(map.values()).map(...)` creates an unnecessary intermediate array which wastes memory allocation and garbage collection time, particularly for frequently re-rendered components handling large collections. **Action:** Use a `for...of` loop over `map.values()` to iterate and push mapped elements directly into the final array for O(1) memory and avoiding intermediate array allocations. +## 2025-02-16 - Avoid intermediate arrays in React Array.from render loops + +**Learning:** Using `Array.from({ length: N }).map(...)` inside React render cycles allocates an unnecessary intermediate array before mapping, creating avoidable GC pressure. +**Action:** Replace `Array.from({ length: N }).map((_, index) => ...)` with `Array.from({ length: N }, (_, index) => ...)` to create each rendered item directly. diff --git a/apps/desktop/src/App.tsx b/apps/desktop/src/App.tsx index c965e47a..385a0518 100644 --- a/apps/desktop/src/App.tsx +++ b/apps/desktop/src/App.tsx @@ -485,7 +485,7 @@ export function App() {