rxdb-hooks VS react-hook-form

- There is an open source RxDB Hooks project: https://github.com/cvara/rxdb-hooks

Click to see: react-hook-form on NPM

React Hook Form (RHF) helps you create performant forms with minimal re-renders and built-in validation. It works with standard HTML form elements, enabling developers to build forms quickly without unnecessary boilerplate. Unlike controlled components, RHF uses uncontrolled components by default, which minimizes re-renders and validation overhead, resulting in faster form rendering.

That gets into a very interesting question of controlled vs. uncontrolled components.

On one hand I like controlled components because there is a single source of truth for the data (a useState()) somewhere in the app, but you are forced to re-render for each keypress. With uncontrolled components on the other hand, there's the possible anarchy of having state in React and in the actual form.

I really like this library

https://react-hook-form.com/

which has a rational answer to the problems that turn up with uncontrolled forms.

For the first time, you don't need to spend hours to read about options because there are two popular packages, react-hook-form and zod, which makes choosing so easy. The documentation is nice and you can get started so quickly.

Check out React Hook Form’s docs for advanced features like async validation.

We’ll be using Zod and drizzle-zod for schema validations in forms. Zod is already packaged on the demo application along withReact Hook Form and Zod resolver for React Hook Form. So, go ahead and install drizzle-zod. And also drizzle-seed that is Drizzle's handy package for seeding in development:

Yup provides you with a declarative way to validate form data in JavaScript apps. It has a set of features which make it a flexible and efficient choice for handling validation in React, React hook form, and other frameworks.

"Instant" can mean different things to different people.

I have an HTMX/Flask/Bootstrap app that feels instant for most requests on the LAN, except when it doesn't.

Often React apps are pretty snappy, but if you want to do complex data validation on controlled forms, where the state updates for every keystroke, it can drag you down. There are good frameworks for doing uncontrolled forms in a disciplined way

https://react-hook-form.com/

but it's another thing to add to your bundle. React is also not fast enough to do animations so you have a lot of .show/.hide (or display: none) CSS has facilities to do transitions and animations that are pretty good but I always find it a little nervewracking for a JS application to have state in React state variables and any other kind of state. Some ImGUI frameworks have components that look superficially like React components but are fast enough to animate every frame, which makes me feel like I am in control and get the animation to look exactly what I want.

Leverage Libraries: Sometimes, the complexity of forms might require more advanced solutions. Libraries like Formik and React Hook Form provide additional tools and patterns that can simplify the process.