Use Lazy State Initialization

Pass a function to `useState` for expensive initial values. Without the function form, the initializer runs on every render even though the value is only used once.

reacthooksuseStateperformanceinitialization

Code Comparison

•Incorrect (runs on every render):tsx

•Correct (runs only once):tsx

Why This Matters

Impact: wasted computation on every render. This optimization is classified as MEDIUM priority for production applications.

Use Functional setState Updates

Extract to Memoized Components

Use←→to navigate