Overview

A side effect is any state change a function makes beyond its return value: mutating an argument or global, writing to disk, sending a request, logging, or touching the DOM. A function without side effects is pure: the same inputs always give the same output and nothing else changes. Push side effects to the edges of a program and keep core logic pure, so tests run without mocks and retries stay safe. Name functions that write or send so callers can see it.

Rules

  • Isolate effects behind injected dependencies (dependency-injection).
  • Make repeated effects safe (idempotent).
  • In React, useEffect is the explicit place for effects triggered by rendering. Rendering itself must stay pure (react-hooks).