Is React Hook Form the future?
Redux-form and Formik are the past
As a Software Developer, I want to work with modern technology and develop the app and achieve the targets faster as soon as possible. I have been dealing with Redux-form and Formik, so I can say they are old and past compare with React-Hook-Form. If you say Why let’s shortly discuss together.
First, you should install it. It is easy and takes a single command:
npm install react-hook-formAnd create LoginForm.js component:
As you can see from the example above, React Hook Form uses uncontrolled form input instead of controlled input/select components and registers their refs into the React hook form. This allows the hook to have full control over your form elements and makes some benefits over another form libs. I want to give you three reasons Why is React Hook Form the future:
1. Easy to use
As you see above, React Hook Form is really easy to use. Also It takes a small amount of code. By official documentation the main goal of React Hook Form:
Reducing the amount of code that you have to write is one of the primary goals for React Hook Form.
2. Super Light
React Hook Form is definitely a tiny library. Hence The package size matters for React Hook Form. React Hook Form use uncontrolled form input components and doesn’t have any dependencies, which makes the library much smaller (5kb gzip).
3. Perfomance
The form has a great performance because it uses uncontrolled components, so you don’t need to have onChange and set value. Hence, you can easily access its ref and avoid re-render(important). If you take a look it, you will wonder how many component re-renders have been triggered by the user.
When I finish typing Email and Full Name, Formik and Redux-Form have over 33+ re-renders, React Hook Form has 3 re-renders. It is great and it gives you a high-performance impact on your page or app.
If I don’t respond for your question, please check out the React Hook Form website. Also, You can find a lot of examples on Github.
I hope you found this post useful.
