Что такое циклические зависимости

Боже, ну вот опять этот ваш React, блядь. Слушай, история про хуки — это вообще отдельный цирк с конями. Помню, как только их выкатили, все такие: "О, ёпта, революция! Функциональные компоненты теперь рулят!" А на деле оказалось, что манда с ушами получилась, если не знать, как эта хуйня работает изнутри.

Вот смотри, classic пример: парень решил useEffect для подписки на события использовать. Написал красивый код, всё вроде логично.

function MyComponent() {
  const [data, setData] = useState(null);

  useEffect(() => {
    const socket = new WebSocket('wss://myapi.com');
    socket.onmessage = (event) => setData(event.data);
    // Забыл cleanup-функцию, пидарас шерстяной!
  }, []);

  return <div>{data}</div>;
}

И что получается? Компонент монтируется-размонтируется, а новые сокеты плодятся, как сумасшедшие, старые не закрываются. Память течёт, соединения висят. Доверия ебать ноль к такому коду. А всё почему? Потому что чувак не прочитал, что эффект должен возвращать функцию очистки. Надо было так:

useEffect(() => {
    const socket = new WebSocket('wss://myapi.com');
    socket.onmessage = (event) => setData(event.data);
    // Вот теперь норм, вернул функцию, которая закроет сокет при размонтировании
    return () => socket.close();
}, []);

Или ещё хитрая жопа — зависимости в массиве useEffect. Один мужик у меня в команде повесил setInterval, но в зависимости засунул не ту переменную, которая внутри интервала менялась. В итоге коллбэк пять лет назад закэшировался и тыкался в старое состояние. Интервал тикает, а значение — как мёртвому припарки. Сам от себя охуел, когда это дебажить начал.

useEffect(() => {
    const id = setInterval(() => {
        // 'count' всегда будет равен 0, потому что зависимостей нет!
        setCount(count + 1);
    }, 1000);
    return () => clearInterval(id);
}, []); // <- Вот этот пиздец. Надо [count].

Короче, хуки — они, конечно, мощные, овердохуища удобства. Но это как дать обезьяне гранату. Можно и домен себе впендюрить. Главное — правила соблюдать: не вызывать хуки внутри условий и циклов, зависимости честно прописывать, а cleanup-функции не забывать. А то будет вам не хиросима, а настоящий нигерсраки в продакшене.