Effects are an escape hatch from the React paradigm. They let you “step outside” of React and synchronize your components with some external system. If there is no external system involved (for example, if you want to update a component’s state when some props or state change), you shouldn’t need an Effect. Removing unnecessary Effects will make your code easier to follow, faster to run, and less error-prone.

There are two common cases in which you don’t need Effects:

  • You don’t need Effects to transform data for rendering.
  • You don’t need Effects to handle user events.


1. useEffect는 리액트랑 상관없는 외부 시스템과 느그 컴포넌트를 연결시키는 역할이다. 외부 시스템이 없으면 쓰지마라.

2. 렌더링시에 데이터를 달리 보여주기 위해(transform하기 위해) useEffect를 쓰지 마라 (주: useMemo를 쓰든가, 기억 안나면 useMemo조차도 쓰지 마라)

3. 유저 이벤트를 핸들링하기위해서 useEffect를 쓰지 마라 (주: 웬만하면 이벤트핸들러 자체에 콜백함수를 박아라)


https://react.dev/learn/escape-hatches#you-might-not-need-an-effect