React DOM APIs

react-dom 패키지는 웹 애플리케이션(브라우저 DOM 환경)에서만 지원되는 메서드를 포함합니다. React Native에서는 지원되지 않습니다.


API

아래 API는 컴포넌트에서 불러올 수 있습니다. 사용할 일은 거의 없습니다.

  • createPortal을 사용하면 자식 컴포넌트를 DOM 트리의 다른 부분에 렌더링 할 수 있습니다.
  • flushSync를 사용하면 React가 State 업데이트를 수행하고 동기적으로 DOM을 업데이트하도록 강제할 수 있습니다.

Resource Preloading APIs

아래 API는 스크립트, 스타일시트, 글꼴과 같은 리소스를 미리 로드하여 앱 속도를 개선하는 데 사용할 수 있습니다. 예를 들어 특정 리소스가 사용될 다른 페이지로 이동하기 전에 리소스를 미리 불러올 수 있습니다.

React 기반 프레임워크에서는 일반적으로 리소스 로딩을 자동으로 처리해 주기 때문에 API를 직접 호출하지 않아도 됩니다. 자세한 내용은 사용하는 프레임워크의 문서를 참고하세요.

  • preconnect를 사용하면 어떤 리소스가 필요한지 모르더라도 리소스를 요청할 것으로 예상되는 서버와 미리 연결할 수 있습니다.
  • prefetchDNS를 사용하면 접속할 가능성이 있는 DNS 도메인의 IP 주소를 미리 조회할 수 있습니다.
  • preinit을 사용하면 외부 스크립트나 스타일시트를 미리 가져오고 실행할 수 있습니다.
  • preinitModule을 사용하면 외부 ESM 모듈을 미리 가져오고 평가Evaluate할 수 있게 해줍니다.
  • preload를 사용하면 스타일시트, 글꼴, 이미지 또는 외부 스크립트 같은 리소스를 미리 가져올 수 있습니다.
  • preloadModule을 사용하면 사용할 ESM 모듈을 미리 가져올 수 있습니다.

진입점

react-dom 패키지는 두 개의 진입점Entry Points을 제공합니다.

  • react-dom/client는 React 컴포넌트를 클라이언트(브라우저)에 렌더링하는 API를 포함합니다.
  • react-dom/server는 React 컴포넌트를 서버에 렌더링하는 API를 포함합니다.

제거된 API

아래 API는 React 19에서 제거되었습니다.