Sanchit Bajaj
Sanchit Bajaj's blog

Follow

Sanchit Bajaj's blog

Follow
Developers might be using useEffect wrong this whole time

Developers might be using useEffect wrong this whole time

Sanchit Bajaj's photo
Sanchit Bajaj
ยทMar 13, 2023ยท

2 min read

Play this article

Table of contents

  • What is wrong?
  • How should I avoid them?
  • References

Hi there everyone ๐Ÿ‘‹, if you're a React Developer then there might be the case that you're misusing the useEffect hook in one way or another. I also have been misusing the react useEffect() hook for a very long time.

So in this blog, I am going to help developers avoid bad use cases with useEffect and how you can completely avoid that as a react developer whether you're a beginner or an advanced developer.

What is wrong?

As react developers, we all worked with useEffect tons and tons of times but have we ever thought about what is useEffect, what it does and whether are we actually using the useEffect the right way or maybe aren't we misusing it? Maybe we are not using useEffect correctly in the right place, it should be used because as we all know we use it for pretty much everything as React Developers for fetching data, handling events, transforming data, large components or even implementing advanced logic.

If you go to the new React Documentation which is completely a re-writing of the old react documentation and look for the useEffect hook, it says

"useEffect is a React Hook that lets you synchronize a component with an external system".

So from this perspective, it means that it is meant for synchronization and not for handling events or transforming data. It is only used for synchronization with an external component.

By synchronization, it means that useEffects are meant to specify side effects that are caused by rendering itself, rather than by a particular event.

How should I avoid them?

To avoid synchronization issues, you can try to minimize your logic like calculation, checking the states, error handling, etc. outside of useEffect hook or you can make go with the declarative paradigm and define all the logic of calculation or transforming data or event handling into different files.

To know more about this, here is the detailed video to which you can refer

Thank you! for reading, please leave your comments if any โœŒ๏ธ

Don't forget to bookmark this blog for the future ๐Ÿ“Œ

Connect with the author:

References

Did you find this article valuable?

Support Sanchit Bajaj by becoming a sponsor. Any amount is appreciated!

Learn more about Hashnode Sponsors
ย 
Share this