Как да съхраняваме стойност в компонент без да извикваме повторно рендиране?

В React, за съхраняване на стойност в компонент без да предизвиква повторно рендериране, можете да използвате hook-а useRef. Стойността, съхранявана в useRef, се запазва между рендерите, но промяната ѝ не предизвиква повторен рендер на компонента.

Пример:

import React, { useRef } from 'react';

function МоятКомпонент() {
  const countRef = useRef(0);

  const увеличи = () => {
    countRef.current += 1;
    console.log('Текуща стойност:', countRef.current);
    // Компонентът няма да се рендерира отново
  };

  return <button onClick={увеличи}>Увеличи</button>;
}

Следователно, useRef е подходящ за съхраняване на всякакви данни, които не влияят на UI-то и не изискват повторен рендер при промяна.