Эта статья проливает свет на десять из этих скрытых функций, а также содержит фрагменты кода, демонстрирующие неправильное и правильное использование.
{ВАЖНО: ВТОРОЙ ФРАГМЕНТ КОДА ОТОБРАЖАЕТ ПРАВИЛЬНЫЙ МЕТОД КАЖДОЙ ФУНКЦИИ
1. Реагировать.memo
React.memo — это компонент более высокого порядка, который запоминает ваши функциональные компоненты, предотвращая ненужные повторные рендеринги. Это может быть особенно полезно для оптимизации производительности.
Факт. Распространенным заблуждением является то, что React.memo – это форма кэширования. Однако он не кэширует компонент, а запоминает визуализированный вывод переданного компонента, предотвращая ненужный рендеринг.
2. Пакетные обновления
По умолчанию React объединяет несколько обновлений состояния в функциональных компонентах в один повторный рендеринг. Но в компонентах класса или асинхронном коде такая автоматическая пакетная обработка может не произойти. Введите нестабильный_batchedUpdates.
Факт: префикс «unstable_» не означает, что система ненадежна; это признак того, что API может измениться в будущих версиях React.
3. React.lazy и саспенс
В React 16.6 появилась функция отложенной загрузки, которая позволяет загружать компоненты только тогда, когда они необходимы, уменьшая первоначальный размер пакета.
Факт: согласно некоторым тестам, с помощью React.lazy вы можете сократить время начальной загрузки до 35 %.
