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์์ ์ ๊ฑฐ๋์์ต๋๋ค.
findDOMNode
: see alternatives.hydrate
: usehydrateRoot
instead.render
: usecreateRoot
instead.unmountComponentAtNode
: useroot.unmount()
instead.renderToNodeStream
: usereact-dom/server
APIs instead.renderToStaticNodeStream
: usereact-dom/server
APIs instead.