useLayoutEffect vs useEffect | React Hooks Tutorial

preview_player
Показать описание

useLayoutEffect vs useEffect: How do you decide which React Hook to use? In this React hooks tutorial, we'll look at the difference between useLayoutEffect and useEffect, the reason why you want to choose the useEffect hook 99% of the time, and the reason why you want to choose useLayoutEffect the other 1%.

useLayoutEffect vs useEffect | React Hooks Tutorial

(00:00) Intro
(00:15) Welcome
(00:25) useEffect vs useLayoutEffect
(01:33) Asynchronous vs Synchronous
(01:54) When to choose useLayoutEffect

🔗 ES7 React JS Snippets Extension for VS Code:

🔗 React Dev Tools Extension for Chrome:

📚 References:

✅ Follow Me:

Was this tutorial about the React hooks useLayoutEffect vs useEffect helpful? If so, please share. Let me know your thoughts in the comments.

#uselayouteffect #react #hooks
Рекомендации по теме
Комментарии
Автор

Best explanation is only possible when the example is solid. Which actually happened here. 👍

yadikishameer
Автор

It is a very good example to understand how useLayoutEffect works. Congrats!

lix
Автор

Thanks this is the best explanation ❤❤❤❤❤❤❤❤

pasindurangana
Автор

best explanation in my opinion kudos to your sir!

ghoniemcodes
Автор

Cool, I wasn't aware of useLayoutEffect. Thanks, Dave!

caffeinated-pixels
Автор

Dave thank you so much for the amazing content, always such a pleasure to learn from you. There's question that I have, that I really hope you get the chance to answer. In react 18 useEffect now renders synchronously before layout and paint when it's the result of a discrete user input such as a click. So in such cases it would behave same as useLayoutEffect, but what I can't understand is, that then what's the difference between the two in such cases? The docs mention that this only affects the timing of when the function passed to useEffect is called, and that *updates scheduled inside these effects are still deferred*, and that useLayoutEffect instead processes the updates immediately. What is meant by "updates" here and is there a way to practically test this distinction between the two in such cases (deferred vs immediately)? Very looking forward to hearing from you.

prince
Автор

Dear Sir will you make video on redux?

World_information