BlogReactReconcilerHookEffectTags

React-reconciler | HookEffectTags (19.0.0)

react/packages/react-reconciler/src/ReactHookEffectTags.js
export type HookFlags = number;
export const NoFlags = /*   */ 0b0000;
export const HasEffect = /* */ 0b0001;
export const Insertion = /* */ 0b0010;
export const Layout = /*    */ 0b0100;
export const Passive = /*   */ 0b1000;

NoFlags

  • useInsertionEffect, useLayoutEffect, useEffect 모두 없음을 나타냅니다.

HasEffect

  • useInsertionEffect, useLayoutEffect, useEffect 중 1개가 있음을 나타냅니다.

Insertion

  • useInsertionEffect가 있음을 나타냅니다.
  • 주로 Emotion, styled-components에서 스타일 태그를 삽입할 때 사용됩니다.

Layout

  • useLayoutEffect가 있음을 나타냅니다.
  • 렌더링 전 실행되는 로직입니다.

Passive

  • useEffect가 있음을 나타냅니다.
  • 렌더링 후 실행되는 로직입니다.
LaneWorkTags