Frontend Разработка | JavaScript & Верстка сайтов. HTML, CSS и React. Уроки для Фронтенд Developer. JS, Vue и Web технологии. IT Карьера, Курсы и Coding.
Наука · 27 июля 2026 г.
🔥 React: useEffect с async-функцией — антипаттерн! — 27 июля 2026 г. в 06:53:43.127
🔥 React: useEffect с async-функцией — антипаттерн! Многие пишут так: useEffect(() => { async function fetchData() { const res = await fetch('/api/data') const json = await res.json() setData(json) } fetchData() }, []) 💥 Это работает, но неявно. Возникают проблемы: - нет отмены запроса при анмаунте; - сложно обрабатывать race conditions; - нельзя обрабатывать ошибки на уровне useEffect. ✅ Лучше — использовать AbortController и обычную функцию: useEffect(() => { const controller = new AbortController() fetch('/api/data', { signal: controller.signal }) .then(res => res.json()) .then(setData) .catch(err => { if (err.name !== 'AbortError') console.error(err) }) return () => controller.abort() }, []) 🧠 Профит: - безопасное отключение; - контроль ошибок; - читаемый код. 👉 @frontend_1