Здравствуйте 👋 Надеюсь, у всех все хорошо в это пандемическое время.
Всякий раз, когда я вижу какие -либо фрагменты кода ReactJS в Интернете, я замечаю ненужное использование USESTATE Анкет
В React Обновление штата очень дорого с точки зрения производительности. Основная причина заключается в том, что всякий раз, когда государство обновляет, компонент снова будет повторно рендеринг.
Вот небольшой пример:
В приведенном выше коде я создал счетчик, используя USESTATE Когда я увеличиваю счетчик Компонент приложения снова перепродажи. Там, если вы проверете журналы Компонент инициализирован Напечатано 4 раза (в первый раз, когда компонент инициализирован и 3 раза, когда я нажимал на кнопку + ). Это повторно распространяется Компонент приложения Потому что я обновляю состояние на щелчке + кнопка.
Здесь нам нужно использовать состояние, потому что наше намерение – показать счетчик ценность в документе.
Рассмотрим следующий код 👇🏻
Здесь я использую две переменные состояния, одна для значения, следующим, чтобы установить тип ввода. Нам действительно нужны две переменные состояния 🤔? На самом деле почему бы нам не попробовать построить этот компонент без состояния? Причина, по которой я говорю, заключается в том, что, если мы строим форму, имеет много входных полей в этом случае, нам нужно передать состояние стоимости Входной компонент от Форма компонента Если это тот случай, что компонент формы будет повторно рендеринг на каждом клавишке на любом входе.
Решение
Во втором примере нам не нужно состояние. USEREF Это хорошо. Проверьте приведенный ниже код 👇🏻
В фрагменте мы не используем состояние, но все же мы можем достичь того, что хотим, без повторного рендеринга. Даже в случае использования формы вместо этого при прохождении состояния из форма к вход Мы можем передать его, предотвращая ненужные повторные ресурсы.
Итак, я бы предложил, когда вы имеете дело с манипуляциями с DOM, например, изменение имени класса условное или изменение любого атрибута элемента и т. Д. Затем попробуйте использовать USEREF вместо USESTATE Анкет Это помешает вашему приложению слишком много повторных ресурсов.
Следуй за мной на LinkedIn: https://www.linkedin.com/in/saketh-kowtha/ Twitter: https://twitter.com/sakethkowtha GitHub: https://github.com/saketh-kowtha
Теперь вы можете продлить свою поддержку, купив мне кофе.
Оригинал: “https://dev.to/sakethkowtha/don-t-be-too-dependent-on-usestate-useref-is-there-for-you-4lhg”