React Hooks

Question 1

useState

Answer 1

Simple local state save in component.

Question 2

useEffect

Answer 2

Side effects, subscribe, fetch

Question 3

useContext

Answer 3

Sharing state between many components without prop drilling.

Question 4

UseMemo

Answer 4

Memorizing expensive calculations avoids recalculating them every time you render.

Question 5

useRef

Answer 5

Stores values ​​that can be changed between renders, or a DOM reference.

Question 6

useLayoutEffect

Answer 6

It fires synchronously after the DOM is updated, before painting on the screen.

Question 7

useCallback

Answer 7

Memoizes functions to keep stable references, important when passing handlers as props to child components, especially together with React.memo.

Question 8

useDeferredValue

Answer 8

Defers an expensive value, the component keeps responding with the old value until the new one is ready.

Question 9

Promise x Observable

Answer 9

Promise delivers one async value once then completes.
Observable emits multiple values over time and can be subscribed, transformed, and canceled.

Pull vs push
Multiple subscribers
Cancelation

Use cases
Promise, single async task, HTTP request once, read file once
Observable, streams, user events, websockets, live data, sequences of async events