Client-side fetching

Client fetching starts after mount — typically in effects or event handlers, or via libraries that wrap those patterns. Handle loading, error, and success UI explicitly. Abort in-flight requests on unmount or dependency change with `AbortController` to prevent race updates.

Avoid fetching in render. Deduplicate concurrent requests for the same resource. Consider whether data belongs in a server-state cache instead of component state.

					useEffect(() => {
  const ctrl = new AbortController();
  fetch(url, { signal: ctrl.signal }).then(/* ... */);
  return () => ctrl.abort();
}, [url]);
				

On interviews, explain the concept with a concrete example and name the behavior interviewers probe.

Common pitfalls include hiding data flow, over-splitting components, and putting side effects in render.

The trade-off is often clarity versus reuse or explicit props versus convenience.

Checklist:

• Never fetch directly during render.
• Abort stale requests.
• Model loading and error states.