⚡ Bolt: [성능 향상] EventList sessionStartedAt 파싱 중복 계산 최적화#296
Conversation
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
There was a problem hiding this comment.
Pull request overview
EventList(react-window 기반 가상화 리스트)에서 각 Row 렌더링마다 반복되던 sessionStartedAt 문자열의 Date 파싱/getTime() 호출을 부모 컴포넌트의 useMemo로 이동해, 스크롤/리렌더 시 불필요한 연산과 GC 부담을 줄이려는 성능 최적화 PR입니다.
Changes:
formatElapsed()가sessionStartedAt문자열 대신 미리 계산된sessionStartedAtMs(number)를 받도록 변경EventList내부에서sessionStartedAtMs를useMemo로 캐싱하고react-windowRow로 전달- Jules/Bolt 학습 로그 문서(
.jules/bolt.md) 추가
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
| packages/web/src/components/dashboard/event-list.tsx | sessionStartedAt의 Date 파싱을 Row 렌더 루프 밖으로 이동해 중복 계산을 줄임 |
| .jules/bolt.md | 가상화 리스트 내 Date 파싱 최적화에 대한 학습/주의사항을 문서화 |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| body-parser@2.3.0: | ||
| resolution: {integrity: sha512-2cGmJupaNgg+QUwVLAucDuWuoMZ6EX9iHDRswZ5lsNYEmwPaRknMPCLZz07yTzVq/83p4o/wzbDZbBrTvGGTIw==} | ||
| engines: {node: '>=18'} | ||
|
|
||
| brace-expansion@1.1.15: | ||
| resolution: {integrity: sha512-EwOCDEex4quD37XhqM3omwtMoJjr//isUZz1JopUNWms+4Z2ViyM/k1YIRePpoVNnQhENnxtFjLaxNHrT7xIUg==} | ||
| brace-expansion@1.1.16: | ||
| resolution: {integrity: sha512-IDw48K2/2kRkg9LdJxurvq3lV3aBgq0REY89duEqFRthjlPdXHKMj7EnQOXVckxzgisinf3nHfrcE2FufFLXMw==} |
| "hono": "4.12.28", | ||
| "js-yaml": "^4.3.0", | ||
| "postcss@<8.5.10": ">=8.5.10", | ||
| "js-yaml@>=4.0.0 <4.3.0": ">=4.3.0", | ||
| "hono@>=4.3.3 <4.12.27": ">=4.12.27", | ||
| "@hono/node-server@<2.0.5": ">=2.0.5", | ||
| "hono@>=4.11.8 <4.12.27": ">=4.12.27", | ||
| "hono@>=4.0.0 <4.12.27": ">=4.12.27", | ||
| "sharp@<0.35.0": ">=0.35.0" |
💡 What:
EventList가상화 컴포넌트 내Row렌더링 시 반복적으로 호출되던sessionStartedAt의 Date 객체 파싱을 부모의useMemo로 분리하여 최적화했습니다.🎯 Why:
react-window를 사용한 가상화 리스트 환경에서, 스크롤 혹은 리렌더링 될 때마다 뷰에 노출되는 모든 Row가 고정된 문자열인sessionStartedAt을 계속해서 Date 객체로 파싱하고getTime()을 호출하는 비효율이 발생하고 있었습니다.📊 Impact: 리스트 아이템 렌더링 시 발생하는 가비지 컬렉션(GC) 부하 및 메인 스레드 연산 시간이 단축되어 스크롤 성능이 향상됩니다.
🔬 Measurement:
pnpm test및pnpm lint통과 확인 완료. 가상화 렌더링 내O(visible_items)복잡도가 정상 유지됨을 코드 리뷰로 검증 완료.PR created automatically by Jules for task 9633848958187294017 started by @seonghobae