React Frontend Developer

Question 1

Что такое Progressive Enhancement и Graceful Degradation? Как HTML может поддерживать оба подхода?

Accepted Answer

Progressive Enhancement и Graceful Degradation — это два подхода к веб-разработке, направленные на создание адаптивных и доступных веб-приложений.

Progressive Enhancement: Старт с базовой версии и добавление улучшений для современных браузеров.

Graceful Degradation: Старт с полной версии и адаптация для старых браузеров.

Question 2

Что такое race condition при запросах?

Accepted Answer

Race condition — это ситуация, когда несколько запросов выполняются параллельно, и результат более медленного запроса перезаписывает результат более быстрого. В итоге состояние приложения может оказаться некорректным. Это часто происходит при быстрых изменениях параметров запроса. Проблема связана не со скоростью сети, а с порядком завершения запросов.

Question 3

Как возникает race condition в React?

Accepted Answer

Race condition в React возникает, когда несколько асинхронных запросов выполняются параллельно и обновляют одно и то же состояние. React не знает, какой запрос является “последним” или актуальным. В результате более старый запрос может завершиться позже и перезаписать более свежие данные. Это приводит к отображению устаревшей информации в UI.

Question 4

Как cleanup-функция помогает решить race condition?

Accepted Answer

Cleanup-функция в useEffect позволяет отменить или игнорировать результат старого запроса, когда эффект больше не актуален. Она вызывается перед повторным запуском эффекта или при размонтировании компонента. Благодаря этому устаревшие запросы не могут обновить состояние. Это один из базовых способов защиты от race condition.

Question 5

Что делает Promise.race?

Accepted Answer

Promise.race — это статический метод, который принимает массив (или итерируемый объект) промисов и возвращает новый промис. Этот новый промис завершается (разрешается или отклоняется) с тем же результатом, что и первый завершившийся промис из переданного списка. Это полезно для реализации таймаутов или когда нужен результат от самого быстрого источника данных.

Question 6

Почему код с callback может работать некорректно в асинхронном контексте?

Accepted Answer

Callback-функция может работать некорректно в асинхронном контексте из-за замыканий и состояния гонки. Если callback использует переменные из внешней области видимости, их значение может измениться до вызова callback, так как асинхронная операция завершится позже. Например, в цикле с асинхронными вызовами все callback могут получить одно и то же значение последней итерации. Это происходит из-за того, что переменная цикла изменяется синхронно, а callback вызываются асинхронно.

Вопросы React Frontend Developer