React developers default to React Hook Form plus Zod plus React Query for forms. That stack is correct for login screens, settings pages, and CRUD modals. It breaks down the moment a form becomes a decision process: conditional pages, cross-field validation via superRefine, derived values cascading across steps, and navigation logic that starts absorbing business rules it was never meant to hold.
This Smashing Magazine article builds the same 4-step form twice. First with RHF plus Zod, where username and password must be typed as optional() at the schema level even though they are conditionally required, because Zod describes object shape, not visibility rules. Step 4 only renders when total is 100 or more. Satisfaction scores of 4 or above trigger one follow-up field, scores of 2 or below trigger another. All of that logic scatters across useWatch calls, superRefine blocks, and useState step tracking. Then the same form is built with SurveyJS, which replaces the component tree with a JSON schema that owns the conditional logic, the page structure, and the derived calculations in one place.
The article is worth reading in full for the side-by-side diff of what moves and what stays between the two models, and for the decision framework it builds toward the end. If you have ever looked at a finished RHF form and realized the component tree is just where you happened to store a workflow engine, this piece names that problem and shows a concrete exit.
[READ ORIGINAL →]