Вопросы React Frontend Developer

Pure components (чистые компоненты) автоматически предотвращают повторные рендеры, если их пропсы или состояние не изменились. Это делается с помощью поверхностного сравнения значений. Обычные компоненты, с другой стороны, рендерятся каждый раз, когда их родительский компонент обновляется, даже если их пропсы или состояние не изменились.

Чистая функция при одинаковых входных данных всегда возвращает одинаковый результат и не изменяет внешнего состояния. Любая мутация глобальных переменных, изменение параметров по ссылке, ввод-вывод (логирование, чтение файлов), генерация случайных чисел или получение текущего времени считается побочным эффектом и нарушает чистоту. Такие эффекты делают поведение нечистых функций менее предсказуемым и сложным для тестирования.

Чистая функция (Pure function) — это функция, которая при одинаковых входных аргументах всегда возвращает одинаковый результат и не имеет побочных эффектов (не изменяет внешнее состояние или переданные ей аргументы). Ее работа зависит только от своих входных данных, что делает ее поведение предсказуемым и легко тестируемым.

PureComponent - это базовый класс в React, который автоматически реализует метод shouldComponentUpdate с поверхностным сравнением пропсов и состояния. Он предотвращает лишние ререндеры компонента, когда пропсы и состояние не изменились, что улучшает производительность приложения.

React.memo — это обёртка для функционального компонента, которая пропускает ререндер, если props не изменились. PureComponent — базовый класс для классового компонента, который делает то же самое, но ещё сравнивает state. В обоих случаях используется поверхностное сравнение (shallow compare). Если props или state меняются по ссылке, компонент будет считаться изменившимся.