The useRenderEnv hook determines whether the component is being rendered on the server (SSR) or the client (CSR) and provides the current state, including a loading indicator. It uses useEffect to update the state once the component is hydrated on the client, ensuring the correct environment is reflected.
npm install @avent-ui/useRenderEnv
import useRenderEnv from '@avent-ui/useRenderEnv';
// return boolean values
const { isLoading, isClient, isServer } = useRenderEnv();
Prop | Type | Description |
---|---|---|
isClient |
boolean |
Indicates whether the component is being rendered on the client side |
isServer |
boolean |
Indicates whether the component is being rendered on the server side |
isLoading |
boolean |
Represents the loading state of the component, while data is fetched or app is hydrated |