Browse Source

Mention TypeScript in the upgrade post (#4567)

* Mention TypeScript in the upgrade post

* Add a link
main
dan 3 years ago
committed by GitHub
parent
commit
b2d16e5ac6
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 15
      content/blog/2022-03-08-react-18-upgrade-guide.md

15
content/blog/2022-03-08-react-18-upgrade-guide.md

@ -126,6 +126,21 @@ Finally, this API will continue to work for rendering e-mails:
For more information on the changes to server rendering APIs, see the working group post on [Upgrading to React 18 on the server](https://github.com/reactwg/react-18/discussions/22), a [deep dive on the new Suspense SSR Architecture](https://github.com/reactwg/react-18/discussions/37), and [Shaundai Person’s](https://twitter.com/shaundai) talk on [Streaming Server Rendering with Suspense](https://www.youtube.com/watch?v=pj5N-Khihgc) at React Conf 2021.
## Updates to TypeScript definitions
If your project uses TypeScript, you will need to update your `@types/react` and `@types/react-dom` dependencies to the latest versions. The new types are safer and catch issues that used to be ignored by the type checker. The most notable change is that the `children` prop now needs to be listed explicitly when defining props, for example:
```typescript{3}
interface MyButtonProps {
color: string;
children?: React.ReactNode;
}
```
See the [React 18 typings pull request](https://github.com/DefinitelyTyped/DefinitelyTyped/pull/56210) for a full list of type-only changes. It links to example fixes in library types so you can see how to adjust your code. You can use the [automated migration script](https://github.com/eps1lon/types-react-codemod) to help port your application code to the new and safer typings faster.
If you find a bug in the typings, please [file an issue](https://github.com/DefinitelyTyped/DefinitelyTyped/discussions/new?category=issues-with-a-types-package) in the DefinitelyTyped repo.
## Automatic Batching {#automatic-batching}
React 18 adds out-of-the-box performance improvements by doing more batching by default. Batching is when React groups multiple state updates into a single re-render for better performance. Before React 18, we only batched updates inside React event handlers. Updates inside of promises, setTimeout, native event handlers, or any other event were not batched in React by default:

Loading…
Cancel
Save