React 18, крупное обновление популярной библиотеки JavaScript, теперь доступен в виде рабочей версии, отмеченной новым параллельным средством рендеринга и автоматической пакетной обработкой обновлений.
Параллельный рендеринг, или «Параллельный React», позволяет React одновременно готовить несколько версий пользовательского интерфейса. Эта скрытая возможность служит основой для многих новых функций в React 18. Concurrent React является добровольным и включается только тогда, когда используются параллельные функции.
Ключевое свойство Concurrent React — возможность прерывания рендеринга. При параллельном рендеринге React может начать обновление, сделать паузу посередине, а затем продолжить позже. React гарантирует, что пользовательский интерфейс будет выглядеть согласованным, даже если рендеринг будет прерван. Поскольку новые экраны можно подготовить в фоновом режиме, не блокируя основной поток, пользовательский интерфейс может немедленно реагировать на ввод пользователя, даже если он находится в середине большой задачи рендеринга, создавая плавный интерфейс.
Concurrent React также может удалять разделы пользовательского интерфейса с экрана, а затем добавлять их обратно позже, повторно используя предыдущее состояние. Функции, созданные для использования преимуществ параллельного рендеринга, включают приостановку, переходы и потоковый рендеринг на сервере. Параллельный рендеринг — это кардинальное изменение.
React 18 был представлен как производственная версия 29 марта после релиз-кандидата, опубликованного 8 марта. Чтобы перейти на новую версию:
npm install react react-dom
В Yarn используйте следующее:
yarn add react react-dom
Другие новые функции и изменения в React 18:
- Включена автоматическая пакетная обработка, что устраняет необходимость вручную пакетировать обновления в коде приложения или библиотеки. Требуется меньше рендеров. Пакетная обработка — это когда React группирует несколько обновлений состояния в один повторный рендеринг для повышения производительности.
- Приостановка для декларативного указания состояния загрузки части дерева компонентов включена для самоуверенных фреймворков, таких как Relay и Next.js, в React 18. Кроме того, приостановка поддерживается на сервере.
- В переходах различают срочные и несрочные обновления.
- API-интерфейсы клиентского и серверного рендеринга были переработаны. Разработчики могут продолжать использовать старые API в React 17 при обновлении до API React 18.
- В строгий режим была добавлена новая проверка, предназначенная только для разработчиков. Эта проверка будет отключать и повторно монтировать каждый компонент при первом монтировании компонента, восстанавливая предыдущее состояние при втором монтировании.
- Серверные компоненты для создания приложений, охватывающих как сервер, так и клиент, ожидаются в предстоящем второстепенном выпуске React 18.x.
