KEMBAR78
[compiler] Allow setStates in use{Layout,Insertion}Effect where the set value is derived from a ref by poteto · Pull Request #34462 · facebook/react · GitHub
Skip to content

Conversation

poteto
Copy link
Member

@poteto poteto commented Sep 10, 2025

@stipsan found this issue where the compiler would bailout on the useLayoutEffect examples in the React docs. While setState in an effect is typically an anti-pattern due to the fact that it hurts performance through cascading renders, the one scenario where it is allowed is if the value being set flows from a ref.

@meta-cla meta-cla bot added the CLA Signed label Sep 10, 2025
@github-actions github-actions bot added the React Core Team Opened by a member of the React Core Team label Sep 10, 2025
Copy link
Member

@josephsavona josephsavona left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Exciting! Thanks for the quick turnaround on this. It's a good start, see comments to make the logic more generic

…et value is derived from a ref

@stipsan found this issue where the compiler would bailout on the `useLayoutEffect` examples in the React docs. While setState in an effect is typically an anti-pattern due to the fact that it hurts performance through cascading renders, the one scenario where it _is_ allowed is if the value being set flows from a ref.
Copy link
Member

@josephsavona josephsavona left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

awesome!

@poteto poteto merged commit 835b009 into main Sep 10, 2025
21 checks passed
@poteto poteto deleted the pr34462 branch September 10, 2025 18:56
github-actions bot pushed a commit that referenced this pull request Sep 10, 2025
…et value is derived from a ref (#34462)

@stipsan found this issue where the compiler would bailout on the
`useLayoutEffect` examples in the React docs. While setState in an
effect is typically an anti-pattern due to the fact that it hurts
performance through cascading renders, the one scenario where it _is_
allowed is if the value being set flows from a ref.

DiffTrain build for [835b009](835b009)
github-actions bot pushed a commit that referenced this pull request Sep 10, 2025
…et value is derived from a ref (#34462)

@stipsan found this issue where the compiler would bailout on the
`useLayoutEffect` examples in the React docs. While setState in an
effect is typically an anti-pattern due to the fact that it hurts
performance through cascading renders, the one scenario where it _is_
allowed is if the value being set flows from a ref.

DiffTrain build for [835b009](835b009)
poteto added a commit to reactjs/react.dev that referenced this pull request Sep 17, 2025
…iler

In facebook/react#34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

```
\`\`\`js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
\`\`\`

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.
poteto added a commit to reactjs/react.dev that referenced this pull request Sep 17, 2025
…iler

In facebook/react#34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.
poteto added a commit to reactjs/react.dev that referenced this pull request Sep 17, 2025
…iler

In facebook/react#34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.
poteto added a commit to reactjs/react.dev that referenced this pull request Sep 17, 2025
…iler

In facebook/react#34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.
poteto added a commit to reactjs/react.dev that referenced this pull request Sep 17, 2025
…iler

In facebook/react#34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.
poteto added a commit to reactjs/react.dev that referenced this pull request Sep 17, 2025
…iler

In facebook/react#34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.
poteto added a commit to reactjs/react.dev that referenced this pull request Sep 18, 2025
…iler

In facebook/react#34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.
poteto added a commit to reactjs/react.dev that referenced this pull request Sep 18, 2025
…iler

In facebook/react#34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.
poteto added a commit to reactjs/react.dev that referenced this pull request Sep 18, 2025
…iler

In facebook/react#34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.
poteto added a commit to reactjs/react.dev that referenced this pull request Sep 18, 2025
…iler (#7988)

In facebook/react#34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.
poteto added a commit to reactjs/react.dev that referenced this pull request Sep 18, 2025
* Add local eslint rule to validate markdown codeblocks with React Compiler

In facebook/react#34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.

* fix compiler errors

I went through the list of existing errors and tried to separate the expected errors from those that seem to be flagging unexpected issues.  In particular, our effects validations are flagging patterns that our own docs examples use. I added todos for these and will follow up later.
mrbadri added a commit to reactjs/fa.react.dev that referenced this pull request Sep 29, 2025
* fix: correct overlay highlighting in code examples (#7669)

* fix: the value property of checkbox to the checked property (#7804)

* No need for useState here — useCounter handles the state internally (#7803)

* docs: fix misplaced prepositional phrase error (#7799)

* Fix wrong documentation for effect events (#7800)

* Fix wrong documentation for effect events

* Update src/content/learn/separating-events-from-effects.md

---------

Co-authored-by: Ricky <rickhanlonii@gmail.com>

* Remove stray console.log and image (#7814)

* fix(template): remove unnecessary import of React in template code (#7750)

* fix(reference): correct singular form of 'Server Functions' to 'Server Function' (#7749)

* Add bold mono font (#7815)

---------

Co-authored-by: Nicolas Ettlin <nicolas.ettlin@me.com>

* Remove TODO comments and convert them to issues (#7743)

* Remove TODO comment and convert to an issue for react-test-renderer

* Remove TODO comment and convert to an issue for react-dom/test-utils

* Add example of `useActionState` handling execution order (#7733)

* docs: update vite link (#7784)

* docs: add bsky link (#7781)

* docs: add bsky link

rename twitter to x

* Update src/content/community/index.md

---------

Co-authored-by: Ricky <rickhanlonii@gmail.com>

* React Montreal Meetings have a new link (#7809)

* fix: remove useless content (#6615)

* fix: wrong verb tense in doc (#7818)

* fix: typo in challenge solution (#7816)

* Use experiemental in all uEE doc sandboxes (#7820)

* Author: Josh Story <story@hey.com>
Date:   2025-05-21 11:01:46 -0700

clarify the nonce and signal options for prerender docs

clarifies why nonce is not an option for prerender APIs.
clarifies how you would use signal to abort a prerender with in page documentation

* Fix wrong explanation in preserving-and-resetting-state (#6043)

* fix: correct broken WAI-ARIA modal dialog link in createPortal reference (#7833)

* fix link from ARIA dialog-modal

* chore: trigger CLA recheck

* Update meetups.md adding React Rajasthan Community (#7831)

Adding the React Community for Rajasthan India

* Update components-and-hooks-must-be-pure.md (#7830)

Some grammar fixes, and language clarifications

* Update referencing-values-with-refs.md (#7829)

Fixed invalid URL

* Add uwu click animation (#7822)

* Fix typo and clarily that a server function reference is created only when that function is used by a Client Component (#7746)

* Add React Alicante 2025 to Conferences page (#7674)

* fix: use const where applicable in examples for keeping components pure (#7819)

* Remove `forwardRef` reference from API listing (#7837)

This API is now under "Legacy APIs" and should probably no longer be listed as a "modern API".

* docs: Refactor context provider usage (#7793)

* delete provider

* Fix NavContext usage in Talks component

* Fix TocContext and LanguagesContext usage in Page component

* Fix IllustrationContext usage in IllustrationBlock component

* Fix LevelContext and TasksContext usage in managing-state.md

* Fix ThemeContext and Context usage in MyApp component

* Fix HighlightContext usage in List component

* Fix ThemeContext usage in MyApp component

* Fix ErrorDecoderContext usage in ErrorDecoderPage component

* Fix ThemeContext usage in MyPage and MyApp components

* Fix ThemeContext usage in MyApp component

* Fix useContext documentation to correct context provider references

* Fix context provider references in createContext documentation

* prettier

* Update src/content/reference/react/createContext.md

---------

Co-authored-by: Ricky <rickhanlonii@gmail.com>

* fix: typo in docs on prerendering (#7823)

* Replace Context.Provider with Context (#7838)

Update to be in line with the recommended way from React 19.

Docs https://react.dev/blog/2024/12/05/react-19#context-as-a-provider

---------

Co-authored-by: Ricky <rickhanlonii@gmail.com>

* fix(blog): resolve typo in React 19 blog post (`refs` → `ref`s) (#7828)

This PR corrects a small typo in the React documentation, changing "`refs`" to "`ref`s" for accuracy and consistency.

* Update analyze_comment.yml (#7840)

* Fix #6915: typo fix (#6917)

* fix: update ids to point to right part of the docs (#7854)

* chore: remove unused date-fns (#7856)

* chore: fix typo in resource and metadata components documentation (#7006)

* fix: correct typo in scaling-up-with-reducer-and-context.md (#7390)

Fix typo in the 'Step 3: Use context anywhere in the tree' section by changing TaskContext to TasksContext for accuracy.

* fix flushSync link (#7862)

* docs(react): fix grammar in forward ref deprecation message (#7864)

* [be] Add deadlinks script (#7879)

While rewriting the compiler docs I happened to notice some deadlinks. This PR adds a new `yarn deadlinks` script to identify all deadlinks.

I decided to make this a script for now for simplicity but in the future could be ported to an ESlint rule.

The script handles:

- [x] checks images correctly (images are stored in /public but links can omit the /public)
- [x] looks up React error codes for dynamic error pages
- [x] lints links to contributors and uses URL from acknowledgements page if the member is no longer active on the core team
- [x] special injected anchor tags like #recap and #challenges

Example:

```
yarn run v1.22.22
$ node scripts/deadLinkChecker.js
Checking 177 markdown files...
Fetched 552 React error codes

src/content/learn/add-react-to-an-existing-project.md:23:58
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/add-react-to-an-existing-project.md:27:45
  Link text: benefit from the best practices
  URL: /learn/start-a-new-react-project#can-i-use-react-without-a-framework
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/add-react-to-an-existing-project.md:152:269
  Link text: a React framework
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/synchronizing-with-effects.md:735:18
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/typescript.md:16:3
  Link text: Common types from `@types/react`
  URL: /learn/typescript/#useful-types
  ✗ Target file not found for: /learn/typescript/

src/content/learn/typescript.md:17:3
  Link text: Further learning locations
  URL: /learn/typescript/#further-learning
  ✗ Target file not found for: /learn/typescript/

src/content/learn/typescript.md:23:5
  Link text: production-grade React frameworks
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/you-might-not-need-an-effect.md:29:399
  Link text: frameworks
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/you-might-not-need-an-effect.md:754:106
  Link text: frameworks
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/your-first-component.md:218:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react/ViewTransition.md:146:248
  Link text: reveal content
  URL: /link-to-suspense-below
  ✗ Target file not found for: /link-to-suspense-below

src/content/reference/react/captureOwnerStack.md:60:94
  Link text: `errorInfo.componentStack` in `onUncaughtError`
  URL: /reference/react-dom/client/hydrateRoot#show-a-dialog-for-uncaught-errors
  ✗ Anchor #show-a-dialog-for-uncaught-errors not found in reference/react-dom/client/hydrateRoot.md

src/content/reference/react/forwardRef.md:9:65
  Link text: here
  URL: /blog/2024/04/25/react-19#ref-as-a-prop
  ✗ Target file not found for: /blog/2024/04/25/react-19

src/content/reference/react/use.md:315:24
  Link text: Server Component
  URL: /reference/react/components#server-components
  ✗ Anchor #server-components not found in reference/react/components.md

src/content/reference/react/useEffect.md:899:67
  Link text: if you use a framework,
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react/useEffect.md:1051:18
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react/useEffect.md:1736:92
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react/useInsertionEffect.md:136:65
  Link text: non-blocking update,
  URL: /reference/react/useTransition#marking-a-state-update-as-a-non-blocking-transition
  ✗ Anchor #marking-a-state-update-as-a-non-blocking-transition not found in reference/react/useTransition.md

src/content/reference/react-dom/createPortal.md:53:76
  Link text: key.
  URL: /learn/rendering-lists/#keeping-list-items-in-order-with-key
  ✗ Target file not found for: /learn/rendering-lists/

src/content/reference/react-dom/index.md:24:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/index.md:51:3
  Link text: `unmountComponentAtNode`
  URL: /reference/react-dom/unmountComponentAtNode
  ✗ Target file not found for: /reference/react-dom/unmountComponentAtNode

src/content/reference/react-dom/preinit.md:7:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/preinitModule.md:7:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/preload.md:7:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/preloadModule.md:7:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/rsc/directives.md:13:36
  Link text: bundlers compatible with React Server Components
  URL: /learn/start-a-new-react-project#full-stack-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/rsc/server-components.md:7:34
  Link text: React Server Components
  URL: /learn/start-a-new-react-project#full-stack-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/rsc/server-functions.md:198:28
  Link text: `useActionState`
  URL: /reference/react-dom/hooks/useFormState
  ✗ Target file not found for: /reference/react-dom/hooks/useFormState

src/content/reference/rsc/server-functions.md:222:28
  Link text: `useActionState`
  URL: /reference/react-dom/hooks/useFormState
  ✗ Target file not found for: /reference/react-dom/hooks/useFormState

src/content/reference/rsc/use-client.md:44:77
  Link text: compatible bundlers
  URL: /learn/start-a-new-react-project#full-stack-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/rsc/use-server.md:98:54
  Link text: serializable props
  URL: /reference/rsc/use-client#passing-props-from-server-to-client-components
  ✗ Anchor #passing-props-from-server-to-client-components not found in reference/rsc/use-client.md

src/content/reference/react-dom/client/createRoot.md:212:278
  Link text: using a framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/client/index.md:7:185
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/components/common.md:919:89
  Link text: check out more examples.
  URL: /reference/react/useRef#examples-dom
  ✗ Anchor #examples-dom not found in reference/react/useRef.md

src/content/reference/react-dom/components/form.md:39:23
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/form.md:233:63
  Link text: reference documentation
  URL: /reference/react/hooks/useOptimistic
  ✗ Target file not found for: /reference/react/hooks/useOptimistic

src/content/reference/react-dom/components/input.md:33:24
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/link.md:33:23
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/meta.md:33:23
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/option.md:39:25
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/progress.md:33:27
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/script.md:34:25
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/select.md:39:25
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/style.md:33:24
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/textarea.md:33:27
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/title.md:33:24
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/server/index.md:7:182
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/static/index.md:7:146
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/blog/2023/03/16/introducing-react-dev.md:45:5
  Link text: API Reference
  URL: /reference
  ✗ Target file not found for: /reference

src/content/blog/2023/03/16/introducing-react-dev.md:610:117
  Link text: Alternatives
  URL: /reference/react-dom/findDOMNode#alternatives
  ✗ Target file not found for: /reference/react-dom/findDOMNode

src/content/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023.md:34:40
  Link text: Next.js App Router
  URL: /learn/start-a-new-react-project#nextjs-app-router
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023.md:95:605
  Link text: Next.js App Router
  URL: /learn/start-a-new-react-project#nextjs-app-router
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/blog/2024/02/15/react-labs-what-we-have-been-working-on-february-2024.md:110:3
  Link text: Sathya Gunasekaran
  URL: /community/team#sathya-gunasekaran
  ✗ Contributor link should be updated to: https://github.com/gsathya

src/content/blog/2024/04/25/react-19-upgrade-guide.md:132:20
  Link text: improved how errors are handled
  URL: /blog/2024/04/25/react-19#error-handling
  ✗ Target file not found for: /blog/2024/04/25/react-19

src/content/blog/2024/04/25/react-19-upgrade-guide.md:502:19
  Link text: `ref` as a prop
  URL: /blog/2024/04/25/react-19#ref-as-a-prop
  ✗ Target file not found for: /blog/2024/04/25/react-19

src/content/blog/2024/12/05/react-19.md:358:391
  Link text: Full-stack React Architecture
  URL: /learn/start-a-new-react-project#which-features-make-up-the-react-teams-full-stack-architecture-vision
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/blog/2024/12/05/react-19.md:392:28
  Link text: React Server Actions
  URL: /reference/rsc/server-actions
  ✗ Target file not found for: /reference/rsc/server-actions

src/content/blog/2025/04/23/react-labs-view-transitions-activity-and-more.md:2498:37
  Link text: view transition classes
  URL: /reference/react/ViewTransition#view-transition-classes
  ✗ Anchor #view-transition-classes not found in reference/react/ViewTransition.md


Found 58 dead links out of 1555 total links

info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

```

* Fix deadlinks (#7880)

* [be] Add deadlinks script

While rewriting the compiler docs I happened to notice some deadlinks. This PR adds a new `yarn deadlinks` script to identify all deadlinks.

I decided to make this a script for now for simplicity but in the future could be ported to an ESlint rule.

The script handles:

- [x] checks images correctly (images are stored in /public but links can omit the /public)
- [x] looks up React error codes for dynamic error pages
- [x] lints links to contributors and uses URL from acknowledgements page if the member is no longer active on the core team
- [x] special injected anchor tags like #recap and #challenges

Example:

```
yarn run v1.22.22
$ node scripts/deadLinkChecker.js
Checking 177 markdown files...
Fetched 552 React error codes

src/content/learn/add-react-to-an-existing-project.md:23:58
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/add-react-to-an-existing-project.md:27:45
  Link text: benefit from the best practices
  URL: /learn/start-a-new-react-project#can-i-use-react-without-a-framework
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/add-react-to-an-existing-project.md:152:269
  Link text: a React framework
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/synchronizing-with-effects.md:735:18
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/typescript.md:16:3
  Link text: Common types from `@types/react`
  URL: /learn/typescript/#useful-types
  ✗ Target file not found for: /learn/typescript/

src/content/learn/typescript.md:17:3
  Link text: Further learning locations
  URL: /learn/typescript/#further-learning
  ✗ Target file not found for: /learn/typescript/

src/content/learn/typescript.md:23:5
  Link text: production-grade React frameworks
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/you-might-not-need-an-effect.md:29:399
  Link text: frameworks
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/you-might-not-need-an-effect.md:754:106
  Link text: frameworks
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/learn/your-first-component.md:218:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react/ViewTransition.md:146:248
  Link text: reveal content
  URL: /link-to-suspense-below
  ✗ Target file not found for: /link-to-suspense-below

src/content/reference/react/captureOwnerStack.md:60:94
  Link text: `errorInfo.componentStack` in `onUncaughtError`
  URL: /reference/react-dom/client/hydrateRoot#show-a-dialog-for-uncaught-errors
  ✗ Anchor #show-a-dialog-for-uncaught-errors not found in reference/react-dom/client/hydrateRoot.md

src/content/reference/react/forwardRef.md:9:65
  Link text: here
  URL: /blog/2024/04/25/react-19#ref-as-a-prop
  ✗ Target file not found for: /blog/2024/04/25/react-19

src/content/reference/react/use.md:315:24
  Link text: Server Component
  URL: /reference/react/components#server-components
  ✗ Anchor #server-components not found in reference/react/components.md

src/content/reference/react/useEffect.md:899:67
  Link text: if you use a framework,
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react/useEffect.md:1051:18
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react/useEffect.md:1736:92
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react/useInsertionEffect.md:136:65
  Link text: non-blocking update,
  URL: /reference/react/useTransition#marking-a-state-update-as-a-non-blocking-transition
  ✗ Anchor #marking-a-state-update-as-a-non-blocking-transition not found in reference/react/useTransition.md

src/content/reference/react-dom/createPortal.md:53:76
  Link text: key.
  URL: /learn/rendering-lists/#keeping-list-items-in-order-with-key
  ✗ Target file not found for: /learn/rendering-lists/

src/content/reference/react-dom/index.md:24:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/index.md:51:3
  Link text: `unmountComponentAtNode`
  URL: /reference/react-dom/unmountComponentAtNode
  ✗ Target file not found for: /reference/react-dom/unmountComponentAtNode

src/content/reference/react-dom/preinit.md:7:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/preinitModule.md:7:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/preload.md:7:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/preloadModule.md:7:1
  Link text: React-based frameworks
  URL: /learn/start-a-new-react-project
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/rsc/directives.md:13:36
  Link text: bundlers compatible with React Server Components
  URL: /learn/start-a-new-react-project#full-stack-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/rsc/server-components.md:7:34
  Link text: React Server Components
  URL: /learn/start-a-new-react-project#full-stack-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/rsc/server-functions.md:198:28
  Link text: `useActionState`
  URL: /reference/react-dom/hooks/useFormState
  ✗ Target file not found for: /reference/react-dom/hooks/useFormState

src/content/reference/rsc/server-functions.md:222:28
  Link text: `useActionState`
  URL: /reference/react-dom/hooks/useFormState
  ✗ Target file not found for: /reference/react-dom/hooks/useFormState

src/content/reference/rsc/use-client.md:44:77
  Link text: compatible bundlers
  URL: /learn/start-a-new-react-project#full-stack-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/rsc/use-server.md:98:54
  Link text: serializable props
  URL: /reference/rsc/use-client#passing-props-from-server-to-client-components
  ✗ Anchor #passing-props-from-server-to-client-components not found in reference/rsc/use-client.md

src/content/reference/react-dom/client/createRoot.md:212:278
  Link text: using a framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/client/index.md:7:185
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/components/common.md:919:89
  Link text: check out more examples.
  URL: /reference/react/useRef#examples-dom
  ✗ Anchor #examples-dom not found in reference/react/useRef.md

src/content/reference/react-dom/components/form.md:39:23
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/form.md:233:63
  Link text: reference documentation
  URL: /reference/react/hooks/useOptimistic
  ✗ Target file not found for: /reference/react/hooks/useOptimistic

src/content/reference/react-dom/components/input.md:33:24
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/link.md:33:23
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/meta.md:33:23
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/option.md:39:25
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/progress.md:33:27
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/script.md:34:25
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/select.md:39:25
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/style.md:33:24
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/textarea.md:33:27
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/components/title.md:33:24
  Link text: common element props.
  URL: /reference/react-dom/components/common#props
  ✗ Anchor #props not found in reference/react-dom/components/common.md

src/content/reference/react-dom/server/index.md:7:182
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/reference/react-dom/static/index.md:7:146
  Link text: framework
  URL: /learn/start-a-new-react-project#production-grade-react-frameworks
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/blog/2023/03/16/introducing-react-dev.md:45:5
  Link text: API Reference
  URL: /reference
  ✗ Target file not found for: /reference

src/content/blog/2023/03/16/introducing-react-dev.md:610:117
  Link text: Alternatives
  URL: /reference/react-dom/findDOMNode#alternatives
  ✗ Target file not found for: /reference/react-dom/findDOMNode

src/content/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023.md:34:40
  Link text: Next.js App Router
  URL: /learn/start-a-new-react-project#nextjs-app-router
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/blog/2023/03/22/react-labs-what-we-have-been-working-on-march-2023.md:95:605
  Link text: Next.js App Router
  URL: /learn/start-a-new-react-project#nextjs-app-router
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/blog/2024/02/15/react-labs-what-we-have-been-working-on-february-2024.md:110:3
  Link text: Sathya Gunasekaran
  URL: /community/team#sathya-gunasekaran
  ✗ Contributor link should be updated to: https://github.com/gsathya

src/content/blog/2024/04/25/react-19-upgrade-guide.md:132:20
  Link text: improved how errors are handled
  URL: /blog/2024/04/25/react-19#error-handling
  ✗ Target file not found for: /blog/2024/04/25/react-19

src/content/blog/2024/04/25/react-19-upgrade-guide.md:502:19
  Link text: `ref` as a prop
  URL: /blog/2024/04/25/react-19#ref-as-a-prop
  ✗ Target file not found for: /blog/2024/04/25/react-19

src/content/blog/2024/12/05/react-19.md:358:391
  Link text: Full-stack React Architecture
  URL: /learn/start-a-new-react-project#which-features-make-up-the-react-teams-full-stack-architecture-vision
  ✗ Target file not found for: /learn/start-a-new-react-project

src/content/blog/2024/12/05/react-19.md:392:28
  Link text: React Server Actions
  URL: /reference/rsc/server-actions
  ✗ Target file not found for: /reference/rsc/server-actions

src/content/blog/2025/04/23/react-labs-view-transitions-activity-and-more.md:2498:37
  Link text: view transition classes
  URL: /reference/react/ViewTransition#view-transition-classes
  ✗ Anchor #view-transition-classes not found in reference/react/ViewTransition.md


Found 58 dead links out of 1555 total links

info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

```

* Fix deadlinks

Following `yarn deadlinks` as a guide, I fixed the following deadlinks:

| File | Link Text | Current URL | Issue Type | Actual Fix Applied | Status |
|------|-----------|-------------|------------|-------------------|--------|
| `add-react-to-an-existing-project.md:23` | React-based frameworks | `/learn/start-a-new-react-project` | Missing file | `/learn/creating-a-react-app` | ✅ Fixed |
| `add-react-to-an-existing-project.md:27` | benefit from the best practices | `/learn/start-a-new-react-project#can-i-use-react-without-a-framework` | Missing file + anchor | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `add-react-to-an-existing-project.md:152` | a React framework | `/learn/start-a-new-react-project` | Missing file | `/learn/creating-a-react-app` | ✅ Fixed |
| `synchronizing-with-effects.md:735` | framework | `/learn/start-a-new-react-project#production-grade-react-frameworks` | Missing file + anchor | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `typescript.md:16` | Common types from `@types/react` | `/learn/typescript/#useful-types` | Trailing slash | `/learn/typescript#useful-types` | ✅ Fixed |
| `typescript.md:17` | Further learning locations | `/learn/typescript/#further-learning` | Trailing slash | `/learn/typescript#further-learning` | ✅ Fixed |
| `typescript.md:23` | production-grade React frameworks | `/learn/start-a-new-react-project#production-grade-react-frameworks` | Missing file + anchor | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `you-might-not-need-an-effect.md:29` | frameworks | `/learn/start-a-new-react-project#production-grade-react-frameworks` | Missing file + anchor | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `you-might-not-need-an-effect.md:754` | frameworks | `/learn/start-a-new-react-project#production-grade-react-frameworks` | Missing file + anchor | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `your-first-component.md:218` | React-based frameworks | `/learn/start-a-new-react-project` | Missing file | `/learn/creating-a-react-app` | ✅ Fixed |
| `ViewTransition.md:146` | reveal content | `/link-to-suspense-below` | Placeholder URL | `/reference/react/Suspense#revealing-content-together-at-once` | ✅ Fixed |
| `captureOwnerStack.md:60` | `errorInfo.componentStack` in `onUncaughtError` | `/reference/react-dom/client/hydrateRoot#show-a-dialog-for-uncaught-errors` | Missing anchor | `/reference/react-dom/client/hydrateRoot#error-logging-in-production` | ✅ Fixed |
| `forwardRef.md:9` | here | `/blog/2024/04/25/react-19#ref-as-a-prop` | Missing file + anchor | `/blog/2024/12/05/react-19#ref-as-a-prop` | ✅ Fixed |
| `use.md:315` | Server Component | `/reference/react/components#server-components` | Missing anchor | `/reference/rsc/server-components` | ✅ Fixed |
| `useEffect.md:899` | if you use a framework, | `/learn/start-a-new-react-project#production-grade-react-frameworks` | Missing file + anchor | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `useEffect.md:1051` | framework | `/learn/start-a-new-react-project#production-grade-react-frameworks` | Missing file + anchor | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `useEffect.md:1736` | framework | `/learn/start-a-new-react-project#production-grade-react-frameworks` | Missing file + anchor | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `useInsertionEffect.md:136` | non-blocking update, | `/reference/react/useTransition#marking-a-state-update-as-a-non-blocking-transition` | Wrong anchor | `/reference/react/useTransition#perform-non-blocking-updates-with-actions` | ✅ Fixed |
| `createPortal.md:53` | key. | `/learn/rendering-lists/#keeping-list-items-in-order-with-key` | Trailing slash | `/learn/rendering-lists#keeping-list-items-in-order-with-key` | ✅ Fixed |
| `react-dom/index.md:24` | React-based frameworks | `/learn/start-a-new-react-project` | Missing file | `/learn/creating-a-react-app` | ✅ Fixed |
| `react-dom/index.md:51` | `unmountComponentAtNode` | `/reference/react-dom/unmountComponentAtNode` | Missing file | `https://18.react.dev/reference/react-dom/unmountComponentAtNode` | ✅ Fixed |
| `preinit.md:7` | React-based frameworks | `/learn/start-a-new-react-project` | Missing file | `/learn/creating-a-react-app` | ✅ Fixed |
| `preinitModule.md:7` | React-based frameworks | `/learn/start-a-new-react-project` | Missing file | `/learn/creating-a-react-app` | ✅ Fixed |
| `preload.md:7` | React-based frameworks | `/learn/start-a-new-react-project` | Missing file | `/learn/creating-a-react-app` | ✅ Fixed |
| `preloadModule.md:7` | React-based frameworks | `/learn/start-a-new-react-project` | Missing file | `/learn/creating-a-react-app` | ✅ Fixed |
| 11 component files | common element props. | `/reference/react-dom/components/common#props` | Wrong anchor | `/reference/react-dom/components/common#common-props` | ✅ Fixed |
| `server/index.md:7` | framework | `/learn/start-a-new-react-project#production-grade-react-frameworks` | Missing file + anchor | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `static/index.md:7` | framework | `/learn/start-a-new-react-project#production-grade-react-frameworks` | Missing file + anchor | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `introducing-react-dev.md:45` | API Reference | `/reference` | Missing index | `/reference/react` | ✅ Fixed |
| `introducing-react-dev.md:610` | Alternatives | `/reference/react-dom/findDOMNode#alternatives` | Missing file | `https://18.react.dev/reference/react-dom/findDOMNode#alternatives` | ✅ Fixed |
| `react-labs-march-2023.md:34` | Next.js App Router | `/learn/start-a-new-react-project#nextjs-app-router` | Missing file + anchor | `/learn/creating-a-react-app#nextjs-app-router` | ✅ Fixed |
| `react-labs-march-2023.md:95` | Next.js App Router | `/learn/start-a-new-react-project#nextjs-app-router` | Missing file + anchor | `/learn/creating-a-react-app#nextjs-app-router` | ✅ Fixed |
| `react-labs-february-2024.md:110` | Sathya Gunasekaran | `/community/team#sathya-gunasekaran` | Contributor link | `https://github.com/gsathya` | ✅ Fixed |
| `react-19-upgrade-guide.md:132` | improved how errors are handled | `/blog/2024/04/25/react-19#error-handling` | Missing file + anchor | `/blog/2024/12/05/react-19#error-handling` | ✅ Fixed |
| `react-19-upgrade-guide.md:502` | `ref` as a prop | `/blog/2024/04/25/react-19#ref-as-a-prop` | Missing file + anchor | `/blog/2024/12/05/react-19#ref-as-a-prop` | ✅ Fixed |
| `react-19.md:358` | Full-stack React Architecture | `/learn/start-a-new-react-project#which-features-make-up-the-react-teams-full-stack-architecture-vision` | Missing file + anchor | `/learn/creating-a-react-app#which-features-make-up-the-react-teams-full-stack-architecture-vision` | ✅ Fixed |
| `react-19.md:392` | React Server Actions | `/reference/rsc/server-actions` | Missing file | `/reference/rsc/server-functions` | ✅ Fixed |
| `view-transitions-activity.md:2498` | view transition classes | `/reference/react/ViewTransition#view-transition-classes` | Missing anchor | `/reference/react/ViewTransition#view-transition-class` | ✅ Fixed |
| `rsc/directives.md:13` | bundlers compatible with React Server Components | `/learn/start-a-new-react-project#full-stack-frameworks` | Missing file | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `rsc/server-components.md:7` | React Server Components | `/learn/start-a-new-react-project#full-stack-frameworks` | Missing file | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `rsc/use-client.md:44` | compatible bundlers | `/learn/start-a-new-react-project#full-stack-frameworks` | Missing file | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `react-dom/client/createRoot.md:212` | using a framework | `/learn/start-a-new-react-project#production-grade-react-frameworks` | Missing file | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `react-dom/client/index.md:7` | framework | `/learn/start-a-new-react-project#production-grade-react-frameworks` | Missing file | `/learn/creating-a-react-app#full-stack-frameworks` | ✅ Fixed |
| `rsc/server-functions.md:198` | `useActionState` | `/reference/react-dom/hooks/useFormState` | Missing file | `/reference/react/useActionState` | ✅ Fixed |
| `rsc/server-functions.md:222` | `useActionState` | `/reference/react-dom/hooks/useFormState` | Missing file | `/reference/react/useActionState` | ✅ Fixed |
| `rsc/use-server.md:98` | serializable props | `/reference/rsc/use-client#passing-props-from-server-to-client-components` | Missing anchor | `/reference/rsc/use-client#serializable-types` | ✅ Fixed |
| `react-dom/components/common.md:919` | check out more examples. | `/reference/react/useRef#examples-dom` | Missing anchor | `/reference/react/useRef#usage` | ✅ Fixed |
| `react-dom/components/form.md:233` | reference documentation | `/reference/react/hooks/useOptimistic` | Missing file | `/reference/react/useOptimistic` | ✅ Fixed |


```
$ yarn deadlinks

yarn run v1.22.22
$ node scripts/deadLinkChecker.js
Checking 177 markdown files...
Fetched 552 React error codes


✓ All 1552 links are valid!

✨  Done in 1.07s.
```

* Revert "Fix deadlinks (#7880)" (#7881)

Original commit changeset: d52b3ec73407

Revert this so we can just fix the real deadlinks.

* Update deadlinks script to take into account redirects (#7882)

* Revert "Fix deadlinks (#7880)"

Original commit changeset: d52b3ec73407

Revert this so we can just fix the real deadlinks.

* Update deadlinks script to take into account redirects

Also check if a redirect exists before erroring.

* Fix deadlinks take 2 (#7883)

Fixes the actual broken links.

```
$ yarn deadlinks

yarn run v1.22.22
$ node scripts/deadLinkChecker.js
Checking 177 markdown files...
Fetched 552 React error codes
Loaded 49 redirects from vercel.json

✓ All 1554 links are valid!

✨  Done in 0.86s.
```

* [compiler] Rewrite React Compiler Docs (#7868)

* Fix deadlinks take 2

Fixes the actual broken links.

```
$ yarn deadlinks

yarn run v1.22.22
$ node scripts/deadLinkChecker.js
Checking 177 markdown files...
Fetched 552 React error codes
Loaded 49 redirects from vercel.json

✓ All 1554 links are valid!

✨  Done in 0.86s.
```

* [compiler] Rewrite React Compiler Docs

We've received [feedback](https://bsky.app/profile/danabra.mov/post/3lr46ciujjs2r) that the compiler docs are difficult to understand and not prominent enough that people don't realize the compiler is a serious project and is near stable.

This PR rewrites the whole compiler doc section, giving it its own category as well as a standalone reference page.

Preview: https://react-dev-git-pr7868-fbopensource.vercel.app/

* [compiler] Fix misleading code example (#7889)

When the compiler bails out on code, it  leaves it untouched and unoptimized, so it's always safe for the compiler to bailout.

`panicThreshold` in most cases should be kept as `'none'` unless you want to fail the build on these safe bailouts. It's really only useful during dev when you're working on increasing the coverage of the compiler on your codebase.

I think having it shown here is confusing so I'm opting to just remove it for this particular code example.

* [compiler] Flesh out incremental adoption intro more (#7890)

Previously the intro was pretty barebones. Fleshed it out a bit more to describe why it might be useful to reach for in a large codebase.

* [compiler] Add note about gating evaluation (#7891)

* [compiler] Flesh out incremental adoption intro more

Previously the intro was pretty barebones. Fleshed it out a bit more to describe why it might be useful to reach for in a large codebase.

* [compiler] Add note about gating evaluation

Clarify when the gating function is evaluated.

* Remove non-existent meetup group (Edinburgh, Scotland) (#7895)

The Edinburgh meetup group no longer exists and I have been unable to find any other Scottish React groups

* Fixes animation jank on hover (#7904)

* fix: box-shadow animation on community (#7905)

Co-authored-by: Fre <frederic.vandeborne@icapps.com>

* Updates to Activity docs (#7884)

* Updates to Activity docs

* wip

* Updates to Activity docs:

- New intro at top of Reference
- Adds "Deferring hydration of low-priority content" section
- Move "Preventing hidden content from having unwanted side effects" section to Troubleshooting
- Removes SSR section from Troubleshooting

* useLayoutEffect + Tidying up

* Use the same color code step for "visible"

* Tidy

* Typo

* Update section on selective hydration

* Update title

* Clean up props

* Tweak wording

* wip

* wip

* wip

* remove temporary scroll restoration while working on docs

* wip

* wip

* Add more information about event and property binding on custom elements (#7939)

Co-authored-by: Sebastian "Sebbie" Silbermann <silbermann.sebastian@gmail.com>

* Touch-ups to Activity (#7940)

* Add React Paris 2025 conference talks + Add React Paris 2026 (#7935)

Co-authored-by: Aimen Ben Amor <aimen_ben_amor@epam.com>

* Add CityJS New Delhi 2026 conference details (#7949)

* Add CityJS New Delhi 2026 conference details

* Update CityJS New Delhi date to 2025

* [compiler] Tweak intro section on manual memo guidance (#7953)

The previous sentence "If you are using React Compiler, useMemo, useCallback, and React.memo can be removed." was coming off a bit too strong and makes it incorrectly seem like the manual memos and compiler memos are 1:1.

Removing the sentence doesn't take anything away from this paragraph, so let's remove it to reduce confusion.

* [compiler][ez] Reference rc tag for install instructions (#7955)

Updates our previous RC blogpost to point people to the `rc` tag, not the specific rc version

* [compiler] Update docs on eslint-plugin-react-hooks installation (#7956)

The compiler rule is now enabled by default in 6.0.0-rc.2, so there is no longer a need to manually enable the compiler rule in user's eslint configs.

* Add reload button, rename reset to clear (#7954)

* fix: typo in component style documentation (#7925)

* fix broken link server-functions (#7923)

* docs: Add Rendercon 2025 Conference (#7962)

* feat(i18n): make DocsPageFooter navigation labels translatable (#7943)

* fix(rtl): resolve RTL issues in Challenges component (#7942)

* Introduce Liverpool and Edinburgh meetup groups. (#7950)

* docs: fix typo in update useTransition.md (#7936)

* docs: fix ordered list numbering in TypeScript with React Components section (#7941)

* Docs: update ref callback behaviour (#7927)

* Add setup to home sidebar (#7963)

* fix: definition typo on view transitions blog post (#7918)

* Fix: grammar and add comma (#7917)

Co-authored-by: unknown <deepanshu.9dd@gmail.com~>

* fix: typo (#7914)

* Recommend installing `@types/*` as dev dependencies

* docs: minor grammar correction (#7906)

`a expensive` should be `an expensive`

* fix : typo in form component documentation (#7894)

Fix "documentatino" typo to "documentation" in comment about useOptimistic reference page.

* Update "Deep Dive" in reusing-logic-with-custom-hooks.md with link and example of the use API (#7767)

* Update "Deep Dive" in reusing-logic-with-custom-hooks.md with link to and example of the use API

* Remove mention of Server Components when explaining the use API

* Update src/content/learn/reusing-logic-with-custom-hooks.md

Co-authored-by: Ricky <rickhanlonii@gmail.com>

* fix: Correct which lines are highlighted in code example

---------

Co-authored-by: Ricky <rickhanlonii@gmail.com>

* Add note that form actions are actions (#7964)

* Remove deprecated loremflickr placeholder images (#7968)

The previous examples used a service called loremflickr.com to link to  placeholder images. Since that service is now down, I updated them to reference placecats.com instead, which we already use in other examples as well. placecats doesn't have the same random cat feature so I roughly approximated it in the example code.

Closes #7966

* Fix handleClick compiler intro example (#7967)

* Fix handleClick compiler intro example

* Use a note instead

* Update src/content/learn/react-compiler/introduction.md

* Fix/tictactoe docs invalid file names (#7969)

* fix: changed source file names in docs from App.js, index.js and styles.css to src/ dir

* fix: updated wrong image with the correct one with current sandbox file structure

* refactor: reverted all formatting and just just mention src folder in introductory section

* Reverted changes tutorial-tic-tac-toe.md

* added enhanced image of sandbox

* Add React Conf 2024 to /videos (#7977)

* docs: add flushSync Troubleshooting section (#7978)

* docs: add flushSync Troubleshooting section

* Update src/content/reference/react-dom/flushSync.md

* oops

* Apply suggestions from code review

* formatting and pitfall

---------

Co-authored-by: Ricky <rickhanlonii@gmail.com>
Co-authored-by: Rick Hanlon <rickhanlonii@meta.com>

* Bump Activity docs to canary  (#7974)

* correct IconExperimental naming and usage (from #7972)

Co-authored-by: Tuna <198469603+TunaDev0@users.noreply.github.com>

* Bump Activity to Canary in docs

---------

Co-authored-by: Tuna <198469603+TunaDev0@users.noreply.github.com>

* Upgrade babel-plugin-react-compiler (#7985)

Happened to notice we were still on an old version of the compiler. This PR upgrades us to use the latest RC.

* Add copyright script (#7991)

Copied over our copyright script from the react repo. I made a small fix to handle shebangs.

* Update copyright on all files (#7992)

* Add copyright script

Copied over our copyright script from the react repo. I made a small fix to handle shebangs.

* Update copyright on all files

Run the script.

* Add local eslint rule to validate markdown codeblocks with React Compiler (#7988)

In https://github.com/facebook/react/pull/34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.

* fix compiler errors (#7989)

* Add local eslint rule to validate markdown codeblocks with React Compiler

In https://github.com/facebook/react/pull/34462 for example, we found an issue where the compiler was incorrectly validating an example straight from the docs.

In order to find more issues like this + also provide more feedback to doc authors on valid/invalid patterns, this PR adds a new local eslint rule which validates all markdown codeblocks containing components/hooks with React Compiler. An autofixer is also provided.

To express that a codeblock has an expected error, we can use the following metadata:

```ts
// pseudo type def
type MarkdownCodeBlockMetadata = {
    expectedErrors?: {
      'react-compiler'?: number[];
    };
  };
```

and can be used like so:

````
```js {expectedErrors: {'react-compiler': [4]}}
// ❌ setState directly in render
function Component({value}) {
  const [count, setCount] = useState(0);
  setCount(value); // error on L4
  return <div>{count}</div>;
}
```
````

Because this is defined as a local rule, we don't have the same granular reporting that `eslint-plugin-react-hooks` yet. I can look into that later but for now this first PR just sets us up with something basic.

* fix compiler errors

I went through the list of existing errors and tried to separate the expected errors from those that seem to be flagging unexpected issues.  In particular, our effects validations are flagging patterns that our own docs examples use. I added todos for these and will follow up later.

* Revert "fix compiler errors (#7989)" (#7995)

This reverts commit 5cc9b7ba31630dd3a2e8178b007e876f83489a54.

* Ignore braces when building Sandpack file map (#7996)

Previously, `createFileMap` split the MDX meta string on spaces and assumed the first token was the filename. Once we prefixed code fences with `{expectedErrors: ...}`, it would incorrectly parse the meta and crash.

This PR updates createFileMap to skip tokens in the meta containing a start and end brace pair (using a stack to ensure we close on the correct brace) while tokenizing the meta string as expected.

Test plan: pages reported in #7994 no longer crash on the next PR

Closes #7994

* Restore lint corrections from #7989 (#7997)

* Ignore braces when building Sandpack file map

Previously, `createFileMap` split the MDX meta string on spaces and assumed the first token was the filename. Once we prefixed code fences with `{expectedErrors: ...}`, it would incorrectly parse the meta and crash.

This PR updates createFileMap to skip tokens in the meta containing a start and end brace pair (using a stack to ensure we close on the correct brace) while tokenizing the meta string as expected.

Test plan: pages reported in #7994 no longer crash on the next PR

Closes #7994

* Restore lint corrections from #7989

Reverts the revert now that we've fixed the bug. These pages should no longer crash:

https://react-dev-git-pr7997-fbopensource.vercel.app/learn/referencing-values-with-refs
https://react-dev-git-pr7997-fbopensource.vercel.app/learn/synchronizing-with-effects
https://react-dev-git-pr7997-fbopensource.vercel.app/learn/separating-events-from-effects
https://react-dev-git-pr7997-fbopensource.vercel.app/learn/removing-effect-dependencies
https://react-dev-git-pr7997-fbopensource.vercel.app/learn/you-might-not-need-an-effect

* Install eslint-local-rules as postinstall (#7993)

For local dev and CI we want to have the eslint-local-rules running, so let's make sure both have their dependencies installed. We don't use a monorepo setup here, which is why they're currently setup as a two completely independent yarn workspaces.

* Add new eslint rule reference docs (#7986)

Adds new docs for our new eslint rules.

* fix confilict

---------

Co-authored-by: Mohammad Reza Badri <85818966+mrbadri@users.noreply.github.com>
Co-authored-by: kosh <sipuofare631@gmail.com>
Co-authored-by: Gourav Bhardwaj <98509451+gbhardwaj00@users.noreply.github.com>
Co-authored-by: Mehmet Mallı <mallimehmet@gmail.com>
Co-authored-by: Ricky <rickhanlonii@gmail.com>
Co-authored-by: Ryosuke Hoda <h.ryosuke820@gmail.com>
Co-authored-by: Nicolas Ettlin <nicolas.ettlin@me.com>
Co-authored-by: Bartosz Klonowski <70535775+BartoszKlonowski@users.noreply.github.com>
Co-authored-by: Ajit <47279189+ajits01@users.noreply.github.com>
Co-authored-by: bornkiss <101384056+bornkiss@users.noreply.github.com>
Co-authored-by: Eric Cote <eric@coteexpert.com>
Co-authored-by: Xleine <xleine@qq.com>
Co-authored-by: Ayman Alhourani <139303034+aalhoura@users.noreply.github.com>
Co-authored-by: Josh Story <story@hey.com>
Co-authored-by: Soichiro Miki <smiki-tky@umin.ac.jp>
Co-authored-by: Dmitry Titov <61434098+dimatitov@users.noreply.github.com>
Co-authored-by: Shubham Gupta <50445450+shubhamui@users.noreply.github.com>
Co-authored-by: G. van Dorland <giodor13@gmail.com>
Co-authored-by: Julius Lundang <cHaLkdusT@users.noreply.github.com>
Co-authored-by: jinsoo <89149734+Jinsoo1004@users.noreply.github.com>
Co-authored-by: John Kapantzakis <kapantzak@gmail.com>
Co-authored-by: Mike DiDomizio <mikedidomizio@gmail.com>
Co-authored-by: Aakansha Doshi <aakansha1216@gmail.com>
Co-authored-by: Jan Kassens <jkassens@meta.com>
Co-authored-by: minami yoshihiko <ymym1990ymym@gmail.com>
Co-authored-by: Kunall Banerjee <14703164+yeskunall@users.noreply.github.com>
Co-authored-by: Amirhossein Alibakhshi <amir78729@gmail.com>
Co-authored-by: Jatin Singh <jadenrizz31@gmail.com>
Co-authored-by: Batuhan Tomo <91488737+Rekl0w@users.noreply.github.com>
Co-authored-by: Noritaka Kobayashi <arukimedesu1166777@gmail.com>
Co-authored-by: Dipesh B C <50456672+bcdipesh@users.noreply.github.com>
Co-authored-by: Simon Schick <demwizzy@gmail.com>
Co-authored-by: lauren <poteto@users.noreply.github.com>
Co-authored-by: melanterite <74186236+melanterite@users.noreply.github.com>
Co-authored-by: Wes Bos <wesbos@gmail.com>
Co-authored-by: Chez Fre <fredvandeborne@hotmail.com>
Co-authored-by: Fre <frederic.vandeborne@icapps.com>
Co-authored-by: Sam Selikoff <sam.selikoff@gmail.com>
Co-authored-by: Corbin Crutchley <crutchcorn@gmail.com>
Co-authored-by: Sebastian "Sebbie" Silbermann <silbermann.sebastian@gmail.com>
Co-authored-by: Ben Amor Aymen <aymenbenamor.bardo@gmail.com>
Co-authored-by: Aimen Ben Amor <aimen_ben_amor@epam.com>
Co-authored-by: Aris Markogiannakis <aristos_m@hotmail.com>
Co-authored-by: SeungMin Shin <sky2197kr@gmail.com>
Co-authored-by: Pouria Damavandi <98946406+PouriaDamavandi@users.noreply.github.com>
Co-authored-by: ramadevsign <50571688+orama254@users.noreply.github.com>
Co-authored-by: asimno <baskinjason2@gmail.com>
Co-authored-by: Brooks Lybrand <brookslybrand@gmail.com>
Co-authored-by: ninamma <32230328+ninamma@users.noreply.github.com>
Co-authored-by: Vitor Monteiro <76404081+vitormrmonteiro@users.noreply.github.com>
Co-authored-by: Deepanshu <112980826+deepu7ds@users.noreply.github.com>
Co-authored-by: unknown <deepanshu.9dd@gmail.com~>
Co-authored-by: Raghunath Prabhakar <82239949+Raghuboi@users.noreply.github.com>
Co-authored-by: Dejumo <adejumoboluwatife8@gmail.com>
Co-authored-by: Fergus Ruston <fergus.ruston@gmail.com>
Co-authored-by: Jinhyun Park <developerjhp@gmail.com>
Co-authored-by: Aurora Scharff <66901228+aurorascharff@users.noreply.github.com>
Co-authored-by: Muhammad Tayyab <115396843+mtayyabrawan@users.noreply.github.com>
Co-authored-by: Akshay Ashok <aks28id@gmail.com>
Co-authored-by: Rick Hanlon <rickhanlonii@meta.com>
Co-authored-by: Tuna <198469603+TunaDev0@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed React Core Team Opened by a member of the React Core Team

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants