Предисловие: React 18 обладает рядом мощных функций и включает в себя параллелизм. Итак, что нового в react 18, разве мы не обрабатываем параллелизм в более ранних версиях. Хорошо, тогда давайте начнем с одного примера.
Предположим, у нас есть более 10 000 продуктов, если мы хотим отфильтровать продукты, то каждое нажатие клавиши на панели поиска задерживает результат между нажатием клавиши на панели поиска и отфильтрованным результатом, мы всегда пытаемся справиться с этим с помощью функций устранения дребезга и регулирования, но по-прежнему мы не можем получить результат в точное время, поэтому какое решение для этого и как функции React 18 помогают в этом.
Итак, вот ответ 🥳
startTransition() и useTransition()
В основном у нас есть два типа переходов: переходы с приоритетом и переходы без приоритета. startTransition позволяет делать определенные обновления как неприоритетные переходы, чтобы приостанавливать неприоритетные переходы и отдавать приоритет срочным переходам. Таким образом, это снижает нагрузку на отрисовку элементов в вашем приложении и делает приложение быстрее, а хук useTransition() сообщает React, что определенные обновления имеют более низкий приоритет, давайте посмотрим, как мы можем это реализовать:
Переменная isPending поставляется с useTransition()Hook и сообщает нам, активен переход или нет. isPending возвращает логическое значение: true или false и соответствующим образом отображает пользовательский интерфейс. setItems нужно обернуть под функцию startTransition, и она начнет работать с приоритетом переходов. Вот как нам понравился параллелизм.
React 18 также предоставляет больше новых функций, таких как автоматическая пакетная обработка и так далее. Я буду исследовать больше и постараюсь охватить его в моей следующей статье.
Спасибо, что прочитали это, пожалуйста, не стесняйтесь высказывать свои мысли и не забывайте подписываться на меня в среде 😊
