diff --git a/.jules/bolt.md b/.jules/bolt.md new file mode 100644 index 00000000..93f39533 --- /dev/null +++ b/.jules/bolt.md @@ -0,0 +1,3 @@ +## 2026-08-22 - [Time Formatting Array Lookups] +**Learning:** For high-throughput render paths in React `ink` terminal UIs, prefer pre-computed array lookups for bounded data (like time formatting 0-59) over repeated string allocations (like `String().padStart()`) to reduce performance overhead. +**Action:** When implementing rendering logic that formats small ranges of numbers, utilize pre-computed lookup tables to minimize string allocations. diff --git a/src/cli/ui/components/messageList/utils.ts b/src/cli/ui/components/messageList/utils.ts index ca9a3ed9..72003ac2 100644 --- a/src/cli/ui/components/messageList/utils.ts +++ b/src/cli/ui/components/messageList/utils.ts @@ -1,6 +1,10 @@ +const PAD_2 = Array.from({ length: 60 }, (_, i) => (i < 10 ? `0${i}` : `${i}`)); + export function formatTime(timestamp: Date): string { - const hours = String(timestamp.getHours()).padStart(2, '0'); - const minutes = String(timestamp.getMinutes()).padStart(2, '0'); - const seconds = String(timestamp.getSeconds()).padStart(2, '0'); + // Performance: Pre-computed array lookups for 0-59 are faster than String().padStart() + // avoiding repeated string allocations in high-throughput render paths. + const hours = PAD_2[timestamp.getHours()]; + const minutes = PAD_2[timestamp.getMinutes()]; + const seconds = PAD_2[timestamp.getSeconds()]; return `${hours}:${minutes}:${seconds}`; }