rerender-lazy-state

What problem does it solve?

This Skill helps React components avoid running expensive initial computations on every render by using the functional form of useState. This improves performance for large data or complex calculations.

Core Features & Use Cases

• Lazy initialization: initialize state with a function to run only once.
• Performance optimization: prevents repeated heavy computations like building indexes or parsing data.
• Real-world use: ideal for caching derived data from props or local storage.

Quick Start

Use lazy initialization by wrapping the initializer in a function when calling useState, e.g., const [value, setValue] = useState(() => expensiveInit())