Как подключить REST API к React приложению так, чтобы оно не зависало?

Делаю приложение на React и нужно получать данные из API, но каждый раз при загрузке страницы запрос выполняется дважды и приложение тормозит. Уже пробовал с useEffect, но всё равно происходит, что я делаю не так?

1 ответ

★ Лучший ответ

Двойной запрос в разработке почти наверняка происходит из-за React 18 со включённым StrictMode, который намеренно монтирует и демонтирует компоненты, чтобы обнаружить побочные эффекты. Чтобы избежать этого, убедись, что твой useEffect имеет пустую зависимость `[]`, если ты хочешь выполнить его только один раз при монтировании, и очищай ожидающие запросы с помощью AbortController или булевого флага в cleanup-функции, чтобы компонент не пытался обновить состояние при демонтировании. Если ты уже это делаешь и приложение всё равно медленное, проблема, вероятно, в том, что ты без необходимости обновляешь состояние или вызываешь массивные перерисовки; используй React DevTools Profiler, чтобы увидеть, где именно зависает приложение, и рассмотри использование `useMemo` или `useCallback`, если у тебя много вычислений или ты передаёшь callbacks дочерним компонентам.

Ваш ответ

Войдите, чтобы ответить.