Skip to content

[18] Add docs for flushSync #4474

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Mar 20, 2022
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 20 additions & 1 deletion content/docs/reference-react-dom.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ The `react-dom` package also provides modules specific to client and server apps

The `react-dom` package exports these methods:
- [`createPortal()`](#createportal)

- [`flushSync()`](#flushsync)

These `react-dom` methods are also exported, but are considered legacy:
- [`render()`](#render)
Expand Down Expand Up @@ -55,6 +55,25 @@ createPortal(child, container)
```

Creates a portal. Portals provide a way to [render children into a DOM node that exists outside the hierarchy of the DOM component](/docs/portals.html).

### `flushSync()` {#flushsync}

```javascript
flushSync(callback)
```

Force React to flush any updates inside the provided callback synchronously. This method is useful for being able to read the result of those updates immediately.

> Note:
>
> `flushSync` can have a significant impact on performance. Use sparingly.
>
> `flushSync` may force pending Suspense boundaries to show their `fallback` state.
>
> `flushSync` may also run pending effects and synchronously apply any updates they contain before returning.
>
> `flushSync` may also flush updates outside the callback when necessary to flush the updates inside the callback. For example, if there are pending updates from a click, React may flush those before flushing the updates inside the callback.

## Legacy Reference
### `render()` {#render}
```javascript
Expand Down