В чем разница между useRef и useState при хранении значения

`useRef` и `useState` оба могут хранить значения, но с ключевыми отличиями: 1. **Рендер компонента**: - `useState` при изменении значения вызывает ререндер компонента. - `useRef` не вызывает ререндер при изменении `.current`. 2. **Синхронность обновлений**: - `useState` обновления асинхронны (состояние может быть не актуально сразу после вызова `setState`). - `useRef` обновляет `.current` синхронно. 3. **Использование**: - `useState` — для данных, влияющих на UI. - `useRef` — для мутабельных значений, не требующих отрисовки (таймеры, DOM-элементы). ```jsx function Example() { const [count, setCount] = useState(0); // Вызовет ререндер const countRef = useRef(0); // Не вызовет const handleClick = () => { countRef.current += 1; // Изменение без ререндера setCount(prev => prev + 1); // Вызовет ререндер }; return Click; } ```