useIsFirstRender

Tracks whether the current render cycle is the initial mount of the component.

Note

This is useful for preventing useEffect logic from running on the initial mount, such as skipping an API call or an animation when the component first appears.

Installation

bash

Description

Utilizes a useRef to persist a boolean flag that is only true during the very first render. Subsequent re-renders will always return false. This is particularly useful for skipping useEffect logic on mount or triggering "Welcome" animations.

Return values

NameTypeDescription
isFirstRenderbooleantrue only on the initial render of the component.

Demo

Is First Render?

Click the button to change the count.
No effects executed yet.

Source code

tsx