useIsomorphicLayoutEffect()

The useIsomorphicLayoutEffect() hook lets switch between using useEffect and useLayoutEffect depending on the execution environment. If your app uses server side rendering, the hook will run useEffect, otherwise it will run useLayoutEffect.

Import

import { useIsomorphicLayoutEffect } from 'react-haiku';

Usage

SSR will run useEffectBrowser will run useLayoutEffect

import { useIsomorphicLayoutEffect } from "react-haiku"

export const Component = () => {
    useIsomorphicLayoutEffect(() => {
        // do whatever
    }, [])

    return (
        <>
            <b>SSR will run useEffect</b>
            <b>Browser will run useLayoutEffect</b>
        </>
    );
}