facebook/react · error · Error

A function wrapped in useEffectEvent can't be called during

Error message

A function wrapped in useEffectEvent can't be called during rendering.

What it means

In the server renderer, useEffectEvent returns a stub (throwOnUseEffectEventCall) that throws whenever it is called: event functions may only run from inside effects and event handlers, and neither executes during SSR. Calling the wrapped function while rendering — even to compute output inside useMemo or a reducer — always throws here.

Source

Thrown at packages/react-server/src/ReactFizzHooks.js:610

      }
      lastRenderPhaseUpdate.next = update;
    }
  } else {
    // This means an update has happened after the function component has
    // returned. On the server this is a no-op. In React Fiber, the update
    // would be scheduled for a future render.
  }
}

export function useCallback<T>(
  callback: T,
  deps: Array<mixed> | void | null,
): T {
  return useMemo(() => callback, deps);
}

function throwOnUseEffectEventCall() {
  throw new Error(
    "A function wrapped in useEffectEvent can't be called during rendering.",
  );
}

export function useEffectEvent<Args, Return, F: (...Array<Args>) => Return>(
  callback: F,
): F {
  // $FlowFixMe[incompatible-type]
  return throwOnUseEffectEventCall;
}

function useSyncExternalStore<T>(
  subscribe: (() => void) => () => void,
  getSnapshot: () => T,
  getServerSnapshot?: () => T,
): T {
  if (getServerSnapshot === undefined) {
    throw new Error(

View on GitHub (pinned to eafeac097b)

Solutions

1. Call useEffectEvent functions only from effects and event handlers — never during render or inside useMemo/reducers
2. If render needs the computed value, call the underlying logic directly instead of the wrapped event function
3. Stay on a stable React channel unless the experiment is required

Example fix

// before
const onPick = useEffectEvent(id => save(id));
const result = onPick(item.id); // called during render -> throws

// after
const onPick = useEffectEvent(id => save(id));
return <button onClick={() => onPick(item.id)}>Save</button>;

try {
  value = eventFn(arg);
} catch (e) {
  if (String(e.message).includes("useEffectEvent can't be called during rendering")) {
    value = computeDirectly(arg); // call the underlying logic during render instead
  } else {
    throw e;
  }
}

When it happens

Trigger: const onPick = useEffectEvent(fn); const label = onPick(id) in a component body during server render; passing the event function to code that invokes it eagerly; experimental-channel React where useEffectEvent exists, used in an SSR'd component.

Common situations: Experimental React (canary/experimental channel) used with SSR; refactors moving logic from an effect or handler into the render path; libraries built against canary APIs rendered on the server.

Related errors

• Rendered more hooks than during the previous render
• startTransition cannot be called during server rendering.
• 407
• 440
• React currently only supports piping to one writable stream.

AI-assisted analysis of facebook/react@eafeac097b (2026-08-21). Data as JSON: /api/errors/0477ac4df2a65cf2. Report an issue: GitHub.