← Усі теми

Питання на співбесіді з React (Middle) з відповідями

75 запитань для співбесіди з теми React (Middle) - з правильними відповідями, поясненнями й посиланнями на документацію.

Пройти цей тест
  1. 1.Коли React зберігає стан компонента між рендерами?
  2. 2.Як скинути стан форми <EditForm /> під час перемикання на іншого користувача?
  3. 3.Що робить React.memo(Component)?
  4. 4.Чому memo не допомагає компоненту <List items={data} onSelect={() => select(id)} style={{ gap: 8 }} />?
  5. 5.Для чого потрібен useMemo?
  6. 6.Чому не можна оголошувати компонент усередині іншого компонента?
  7. 7.Як пов'язані useCallback(fn, deps) і useMemo?
  8. 8.Коли useCallback справді корисний?
  9. 9.Коли useReducer кращий за useState?
  10. 10.Чим useLayoutEffect відрізняється від useEffect?
  11. 11.Чому лічильник зупиниться на 1?
  12. 12.Чому цей ефект виконується після кожного рендеру?
  13. 13.Як уникнути гонки під час завантаження даних у useEffect, якщо userId швидко змінюється?
  14. 14.Як правильно отримати fullName з firstName і lastName, що зберігаються в state?
  15. 15.Які помилки НЕ ловить error boundary?
  16. 16.Що змінилося з передаванням ref у функціональні компоненти в React 19?
  17. 17.Як поводяться події всередині порталу createPortal(child, document.body)?
  18. 18.Що таке компонент вищого порядку (HOC)?
  19. 19.У чому суть патерну render props?
  20. 20.Що таке патерн compound components?
  21. 21.Чому всі споживачі контексту перемальовуються за кожного рендеру провайдера?
  22. 22.Навіщо ділять контекст на StateContext і DispatchContext?
  23. 23.Що робить useTransition?
  24. 24.Коли варто використовувати useDeferredValue?
  25. 25.Що таке автоматичний батчинг у React 18+?
  26. 26.Для чого потрібен useId?
  27. 27.Для чого потрібен useSyncExternalStore?
  28. 28.Чим use(promise) з React 19 відрізняється від звичайних хуків?
  29. 29.Що дає useActionState у React 19?
  30. 30.Для чого useOptimistic?
  31. 31.Що робить React Compiler?
  32. 32.Чому React Hook Form зазвичай швидший за форми на керованих полях?
  33. 33.Як поводяться вкладені <Suspense>-межі?
  34. 34.Де зазвичай найвигідніше застосовувати code splitting через lazy?
  35. 35.Що не так із цим case reducer у createSlice?
  36. 36.Які дії генерує createAsyncThunk('users/fetch', ...)?
  37. 37.Як RTK Query розуміє, які дані перезапитати після мутації?
  38. 38.Що таке RTK Query?
  39. 39.Що дає createEntityAdapter?
  40. 40.Чому цей селектор спричиняє перемальовування за будь-якої дії в store?
  41. 41.Коли Redux (або Zustand) доречніший за React Context?
  42. 42.Чим у TanStack Query staleTime відрізняється від gcTime?
  43. 43.Чому з налаштуваннями за замовчуванням TanStack Query перезапитує дані під час повернення на вкладку?
  44. 44.Як оновити список після успішного створення елемента через useMutation?
  45. 45.Які запити інвалідує invalidateQueries({ queryKey: ['todos'] })?
  46. 46.Як реалізувати оптимістичне оновлення через кеш у TanStack Query?
  47. 47.Як виконати запит лише після того, як отримано user.id з іншого запиту?
  48. 48.Як під час пагінації показувати стару сторінку, поки вантажиться нова, замість скелетона?
  49. 49.Що робить TanStack Query в разі помилки запиту за замовчуванням на клієнті?
  50. 50.Навіщо в useQuery опція select?
  51. 51.Що не так із цим ефектом?
  52. 52.Куди помістити код, що має виконатися, бо користувач натиснув «Купити»?
  53. 53.Чому цей ефект чату перепідключається під час зміни теми?
  54. 54.Чому цей ефект перезапускається на кожному рендері, хоч options виглядає однаково?
  55. 55.Як компоненту підписатися на браузерну подію на кшталт resize?
  56. 56.Яким має бути добрий власний хук?
  57. 57.Як forwardRef співвідноситься з React 19?
  58. 58.Що й коли показує <Suspense fallback={<Spinner />}>?
  59. 59.Які змінні стану тут потрібні?
  60. 60.Як уникнути безлічі логічних прапорців на кшталт isSending, isSent, isError одночасно?
  61. 61.Чому цей компонент нечистий?
  62. 62.Що відбувається, коли стан компонента змінюється, але результівний JSX ідентичний?
  63. 63.Що робить setCount(5), якщо count уже дорівнює 5?
  64. 64.Як виміряти розмір елемента одразу після рендера, до малювання браузером?
  65. 65.Чому список контрольованих полів може втрачати фокус на кожне натискання клавіші?
  66. 66.Для чого потрібен компонент <Profiler>?
  67. 67.Чому нормально викликати setState усередині useEffect, що залежить від userId, щоб завантажити дані?
  68. 68.Чим допомагає useFormStatus у формі React 19?
  69. 69.Що робить <form action={saveAction}> у React 19?
  70. 70.Про що зазвичай свідчить використання Children.map або cloneElement у сучасному React?
  71. 71.Що відбувається, якщо батько передає onChange={() => {}} інлайн мемоізованому нащадку?
  72. 72.Коли зміна значення useRef спричиняє перерендер?
  73. 73.Чому не можна читати чи записувати ref.current під час рендера?
  74. 74.Чим відрізняються контрольований і неконтрольований компоненти в дизайн-системі?
  75. 75.Чому useEffect з async-колбеком може бути проблемою?