f3890fc6bc
Extracted the grid mapping logic out of the return block into a `useMemo` hook depending on `[assets, layout, openLightbox]`. This prevents the entire photo grid—including complex Next.js `<Image>` and `<FadeIn>` components—from needlessly re-rendering every time the user navigates via the lightbox arrows or presses next/prev buttons, which previously caused `lightboxIndex` to update and trigger a re-render of the entire grid. Co-authored-by: google-labs-jules[bot] <161369871+google-labs-jules[bot]@users.noreply.github.com>
5 lines
738 B
Markdown
5 lines
738 B
Markdown
## YYYY-MM-DD - [Memoize grid item re-rendering]
|
|
|
|
**Learning:** `useMemo` can significantly boost the performance of long list or grid components (like `PhotoGrid` component) that otherwise gets re-rendered on simple interactions like navigating the image lightbox. Running standard formatting `pnpm format` applies huge changes across entire directories, so it's generally best to format and clean up ONLY modified files to avoid huge diff pollution in code review.
|
|
**Action:** Be extremely cautious of running format/lint commands at the root codebase; specify only modified directories or files, or avoid formatting if it cascades globally. Focus on targeted memoization where state changes dictate expensive array mapping operations.
|