Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions .jules/bolt.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,3 +5,7 @@
## 2025-03-09 - Replace .map() with point updates for React state arrays
**Learning:** For updating single items in small React state arrays (e.g., layout configurations or task lists), using `array.map()` introduces significant performance overhead by iterating through the entire array and calling the callback for every element. This causes unnecessary processing.
**Action:** Prefer "point updates" using `findIndex` and array spreading over `array.map()`. This minimizes object allocations and improves fluidity, especially on lower-power devices.

## 2025-03-09 - Consolidate Multiple Array Iterations into Single Loop for Derived React State
**Learning:** When deriving multiple unique sets of data from a single large source array (like categories and profiles from a shortcuts list), using separate `useMemo` hooks with chained declarative array methods (`map`, `flatMap`, `Set`) results in multiple unnecessary iterations over the entire dataset and intermediate array allocations. This scales poorly with large arrays.
**Action:** Consolidate the calculations into a single `useMemo` hook and use a single imperative `for` loop to populate multiple `Set`s simultaneously. This reduces iteration count and memory overhead, yielding significant performance gains on large datasets.
22 changes: 17 additions & 5 deletions components/CategoryFilterWidget.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,24 @@ import { UsersIcon } from '@heroicons/react/24/outline';
export const CategoryFilterWidget: React.FC = () => {
const { shortcuts, filterCategory, setFilterCategory, filterProfile, setFilterProfile } = useGTab();

const activeCategories = useMemo(() => {
return ['All', ...new Set(shortcuts.map(s => s.category))];
}, [shortcuts]);
const { activeCategories, uniqueProfiles } = useMemo(() => {
const categories = new Set<string>();
const profiles = new Set<string>();

for (let i = 0; i < shortcuts.length; i++) {
const s = shortcuts[i];
if (s.category) categories.add(s.category);
if (s.profiles) {
for (let j = 0; j < s.profiles.length; j++) {
profiles.add(s.profiles[j].name);
}
}
}

const uniqueProfiles = useMemo(() => {
return Array.from(new Set(shortcuts.flatMap(s => s.profiles?.map(p => p.name) || []))).sort();
return {
activeCategories: ['All', ...categories],
uniqueProfiles: Array.from(profiles).sort()
};
}, [shortcuts]);

return (
Expand Down

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Large diffs are not rendered by default.

Loading