В чем разница между :focus и :focus-within

А, ну ты смотри, какие дела творятся в мире фронтенда! Сидишь ты такой, пишешь на React, всё по феншую, компоненты разложил, пропсы прокинул, а тут — бац! — и вылезает эта старая, добрая проблема с useEffect и зависимостями. Ну прям классика жанра, ёпта!

Вот представь: пишешь ты компонент, который данные подгружает. Всё вроде логично: useEffect, внутри fetch, состояние обновляется. Красота! А потом начинается... Эта хуйня начинает запросы слать при каждом чихе, будто у неё денег на серверное железо нет! А всё почему? Потому что в массиве зависимостей сидит какая-нибудь переменная, которая на каждый рендер новая, и useEffect думает: «О, опять работать надо!».

function MyComponent() {
  const [data, setData] = useState(null);
  const fetchUrl = 'https://api.example.com/data'; // Константа, вроде бы

  useEffect(() => {
    fetch(fetchUrl)
      .then(response => response.json())
      .then(setData);
  }, [fetchUrl]); // И эта сука будет триггерить эффект на каждый рендер, если fetchUrl пересоздаётся!
}, [fetchUrl]); // И эта сука будет триггерить эффект на каждый рендер, если fetchUrl пересоздаётся!

Видишь? fetchUrl вроде бы строка, но если компонент перерендеривается, она может создаваться заново (особенно если это не примитив, а объект или массив). И useEffect, этот дотошный пидарас, их сравнивает и говорит: «Ага, ссылки разные — значит, пора работать!». И пошло-поехало, бесконечный цикл, сервер в агонии.

Вот и получается, что вместо того чтобы один раз данные получить, твоё приложение дрочит запросы без остановки. Удивление пиздец! А решение-то, блядь, простое, как три копейки: либо выноси эту переменную за пределы компонента, либо используй useMemo или useCallback, чтобы ссылка не менялась. Или, на худой конец, в зависимости вообще не указывай, если реально нужно один раз запустить — пустой массив поставь. Но осторожно, а то потом будешь чесать репу: «А почему у меня данные не обновляются, когда пропсы меняются?». Сам от себя охуеешь.

Короче, мораль такая: с useEffect надо дружить, но держать его в ежовых рукавицах. А то он тебя так заебёт с этими зависимостями, что волнение ебать, терпения ноль ебать. Чистая магия, но если правила не соблюдать — превращается в чёрную. Вот так вот, в рот меня чих-пых!