diff --git a/src/content/reference/react-dom/index.md b/src/content/reference/react-dom/index.md
index 8bb274b7234..80fd58facd0 100644
--- a/src/content/reference/react-dom/index.md
+++ b/src/content/reference/react-dom/index.md
@@ -19,16 +19,16 @@ These APIs can be imported from your components. They are rarely used:
## Resource Preloading APIs {/*resource-preloading-apis*/}
-These APIs can be used to make apps faster by pre-loading resources such as scripts, stylesheets, and fonts as soon as you know you need them, for example before navigating to another page where the resources will be used:
+These APIs can be used to make apps faster by pre-loading resources such as scripts, stylesheets, and fonts as soon as you know you need them, for example before navigating to another page where the resources will be used.
+[React-based frameworks](/learn/start-a-new-react-project) frequently handle resource loading for you, so you might not have to call these APIs yourself. Consult your framework's documentation for details.
+
+* [`prefetchDNS`](/reference/react-dom/prefetchDNS) lets you prefetch the IP address of a DNS domain name that you expect to connect to.
+* [`preconnect`](/reference/react-dom/preconnect) lets you connect to a server you expect to request resources from, even if you don't know what resources you'll need yet.
* [`preload`](/reference/react-dom/preload) lets you fetch a stylesheet, font, image, or external script that you expect to use.
* [`preloadModule`](/reference/react-dom/preloadModule) lets you fetch an ESM module that you expect to use.
* [`preinit`](/reference/react-dom/preinit) lets you fetch and evaluate an external script or fetch and insert a stylesheet.
* [`preinitModule`](/reference/react-dom/preinitModule) lets you fetch and evaluate an ESM module.
-* [`prefetchDNS`](/reference/react-dom/prefetchDNS) lets you prefetch the IP address of a DNS domain name that you expect to connect to.
-* [`preconnect`](/reference/react-dom/preconnect) lets you connect to a server you expect to request resources from, even if you don't know what resources you'll need yet.
-
-
---
diff --git a/src/content/reference/react-dom/preconnect.md b/src/content/reference/react-dom/preconnect.md
index 89039f3e9c8..cb14a5e89b1 100644
--- a/src/content/reference/react-dom/preconnect.md
+++ b/src/content/reference/react-dom/preconnect.md
@@ -1,7 +1,14 @@
---
title: preconnect
+canary: true
---
+
+
+The `preconnect` function is currently only available in React's Canary and experimental channels. Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
+
+
+
`preconnect` lets you eagerly connect to a server that you expect to load resources from.
diff --git a/src/content/reference/react-dom/prefetchDNS.md b/src/content/reference/react-dom/prefetchDNS.md
index 42920fd0ccb..f9889836ee7 100644
--- a/src/content/reference/react-dom/prefetchDNS.md
+++ b/src/content/reference/react-dom/prefetchDNS.md
@@ -1,7 +1,14 @@
---
title: prefetchDNS
+canary: true
---
+
+
+The `prefetchDNS` function is currently only available in React's Canary and experimental channels. Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
+
+
+
`prefetchDNS` lets you eagerly look up the IP of a server that you expect to load resources from.
diff --git a/src/content/reference/react-dom/preinit.md b/src/content/reference/react-dom/preinit.md
index a2bbfc3b450..5a04528bd6e 100644
--- a/src/content/reference/react-dom/preinit.md
+++ b/src/content/reference/react-dom/preinit.md
@@ -1,7 +1,20 @@
---
title: preinit
+canary: true
---
+
+
+The `preinit` function is currently only available in React's Canary and experimental channels. Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
+
+
+
+
+
+[React-based frameworks](/learn/start-a-new-react-project) frequently handle resource loading for you, so you might not have to call this API yourself. Consult your framework's documentation for details.
+
+
+
`preinit` lets you eagerly fetch and evaluate a stylesheet or external script.
diff --git a/src/content/reference/react-dom/preinitModule.md b/src/content/reference/react-dom/preinitModule.md
index fc90749b8a4..ba6316a7a16 100644
--- a/src/content/reference/react-dom/preinitModule.md
+++ b/src/content/reference/react-dom/preinitModule.md
@@ -1,7 +1,20 @@
---
title: preinitModule
+canary: true
---
+
+
+The `preinitModule` function is currently only available in React's Canary and experimental channels. Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
+
+
+
+
+
+[React-based frameworks](/learn/start-a-new-react-project) frequently handle resource loading for you, so you might not have to call this API yourself. Consult your framework's documentation for details.
+
+
+
`preinitModule` lets you eagerly fetch and evaluate an ESM module.
diff --git a/src/content/reference/react-dom/preload.md b/src/content/reference/react-dom/preload.md
index c05cd9fb29a..ffec1177c07 100644
--- a/src/content/reference/react-dom/preload.md
+++ b/src/content/reference/react-dom/preload.md
@@ -1,7 +1,20 @@
---
title: preload
+canary: true
---
+
+
+The `preload` function is currently only available in React's Canary and experimental channels. Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
+
+
+
+
+
+[React-based frameworks](/learn/start-a-new-react-project) frequently handle resource loading for you, so you might not have to call this API yourself. Consult your framework's documentation for details.
+
+
+
`preload` lets you eagerly fetch a resource such as a stylesheet, font, or external script that you expect to use.
@@ -40,7 +53,7 @@ The `preload` function provides the browser with a hint that it should start dow
* `href`: a string. The URL of the resource you want to download.
* `options`: an object. It contains the following properties:
- * `as`: a required string. The type of resource. Its possible values are `audio`, `document`, `embed`, `fetch`, `font`, `image`, `object`, `script`, `style`, `track`, `video`, `worker`.
+ * `as`: a required string. The type of resource. Its [possible values](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#as) are `audio`, `document`, `embed`, `fetch`, `font`, `image`, `object`, `script`, `style`, `track`, `video`, `worker`.
* `crossOrigin`: a string. The [CORS policy](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/crossorigin) to use. Its possible values are `anonymous` and `use-credentials`. It is required when `as` is set to `"fetch"`.
* `referrerPolicy`: a string. The [Referrer header](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#referrerpolicy) to send when fetching. Its possible values are `no-referrer-when-downgrade` (the default), `no-referrer`, `origin`, `origin-when-cross-origin`, and `unsafe-url`.
* `integrity`: a string. A cryptographic hash of the resource, to [verify its authenticity](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity).
@@ -50,8 +63,6 @@ The `preload` function provides the browser with a hint that it should start dow
* `imageSrcSet`: a string. For use only with `as: "image"`. Specifies the [source set of the image](https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images).
* `imageSizes`: a string. For use only with `as: "image"`. Specifies the [sizes of the image](https://developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_images).
-
-
#### Returns {/*returns*/}
`preload` returns nothing.
diff --git a/src/content/reference/react-dom/preloadModule.md b/src/content/reference/react-dom/preloadModule.md
index abf563c0b2c..05333f1cb71 100644
--- a/src/content/reference/react-dom/preloadModule.md
+++ b/src/content/reference/react-dom/preloadModule.md
@@ -1,7 +1,20 @@
---
title: preloadModule
+canary: true
---
+
+
+The `preloadModule` function is currently only available in React's Canary and experimental channels. Learn more about [React's release channels here](/community/versioning-policy#all-release-channels).
+
+
+
+
+
+[React-based frameworks](/learn/start-a-new-react-project) frequently handle resource loading for you, so you might not have to call this API yourself. Consult your framework's documentation for details.
+
+
+
`preloadModule` lets you eagerly fetch an ESM module that you expect to use.
diff --git a/src/sidebarReference.json b/src/sidebarReference.json
index 893d9f61758..5c9ad86fa67 100644
--- a/src/sidebarReference.json
+++ b/src/sidebarReference.json
@@ -243,27 +243,33 @@
},
{
"title": "preconnect",
- "path": "/reference/react-dom/preconnect"
+ "path": "/reference/react-dom/preconnect",
+ "canary": true
},
{
"title": "prefetchDNS",
- "path": "/reference/react-dom/prefetchDNS"
+ "path": "/reference/react-dom/prefetchDNS",
+ "canary": true
},
{
"title": "preinit",
- "path": "/reference/react-dom/preinit"
+ "path": "/reference/react-dom/preinit",
+ "canary": true
},
{
"title": "preinitModule",
- "path": "/reference/react-dom/preinitModule"
+ "path": "/reference/react-dom/preinitModule",
+ "canary": true
},
{
"title": "preload",
- "path": "/reference/react-dom/preload"
+ "path": "/reference/react-dom/preload",
+ "canary": true
},
{
"title": "preloadModule",
- "path": "/reference/react-dom/preloadModule"
+ "path": "/reference/react-dom/preloadModule",
+ "canary": true
},
{
"title": "render",