Extracted the high-frequency typing animation logic into a new, memoized `TypedText` component. This prevents the entire `Hero` component (including the heavy `GradientBlinds`) from re-rendering on every character update. - Created `TypedText` component in `Hero.tsx` - Wrapped `TypedText` in `React.memo` - Moved `useTypingEffect` call into `TypedText` - Updated `Hero` to use `TypedText` Co-authored-by: ragusa-it <196988693+ragusa-it@users.noreply.github.com>
830 B
830 B
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.
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.