1fe7db0e16
- Replace immutable refs with mutable objects for pointer tracking to reduce GC pressure - Remove synchronous getBoundingClientRect from animation loop to prevent layout thrashing - Ensure mouse coordinates are updated efficiently without re-allocating arrays Co-authored-by: ragusa-it <196988693+ragusa-it@users.noreply.github.com>
15 lines
1.7 KiB
Markdown
15 lines
1.7 KiB
Markdown
## 2024-05-22 - Missing Scripts and Environment
|
|
**Learning:** The project lacks `lint` script in `package.json`. Running `pnpm lint` might invoke system tools (like Android Lint?) instead of failing or doing nothing useful. Always check `package.json` scripts first.
|
|
**Action:** Use specific commands like `pnpm exec tsc --noEmit` or `npx vitest` as discovered/documented, rather than assuming standard scripts exist.
|
|
|
|
## 2025-01-26 - Missing Node Modules
|
|
**Learning:** The environment might lack `node_modules` completely, preventing `npx vitest` or `pnpm exec tsc` from running even if dependencies are listed in `package.json`. Network restrictions may prevent `pnpm install`.
|
|
**Action:** When `node_modules` is missing and cannot be installed, rely on static analysis, careful code review, and verifying file contents manually. Do not assume tests can run.
|
|
## 2024-05-22 - High-Frequency State Isolation
|
|
**Learning:** High-frequency state updates (like typing effects) in large parent components (`Hero`) trigger massive unnecessary re-renders of expensive sub-trees (`GradientBlinds`, `Button`).
|
|
**Action:** Isolate high-frequency state into small, leaf-node components (e.g., `TypedText`) and wrap them in `React.memo` if necessary, keeping the heavy parent static.
|
|
|
|
## 2025-01-26 - WebGL Layout Thrashing
|
|
**Learning:** WebGL animation loops often contain fallback paths (e.g., `if (!rect) rect = getBoundingClientRect()`) that trigger synchronous layout thrashing every frame if the primary path fails or initializes late.
|
|
**Action:** Remove synchronous layout reads from `requestAnimationFrame` loops. Use `ResizeObserver` to cache dimensions and handle the "not ready" state by skipping updates or using safe defaults (0,0) instead of forcing a reflow.
|