Validação de formulários e APIs é crítica. Por anos, Yup foi o rei. Mas a ascensão do TypeScript trouxe uma necessidade nova: Inferência de Tipos. É aqui que o Zod brilha.
O Problema do Yup com TypeScript
Com Yup, você definia o esquema de validação e, separadamente, definia a interface TypeScript. Isso gerava código duplicado. Se você mudasse o esquema, precisava lembrar de mudar a interface.
// O jeito antigo (Ruim)
interface User {
name: string;
age: number;
}
const userSchema = yup.object({
name: yup.string().required(),
age: yup.number().required()
});
A Magia do Zod
O Zod foi desenhado com "TypeScript First". Você define o esquema, e o Zod gera o tipo para você.
import { z } from "zod";
// 1. Defina o esquema
const UserSchema = z.object({
name: z.string().min(2, "Nome muito curto"),
email: z.string().email(),
age: z.number().min(18).optional()
});
// 2. Infira o tipo automaticamente!
type User = z.infer<typeof UserSchema>;
// User agora é: { name: string; email: string; age?: number | undefined }
Uma única fonte da verdade. Se mudar a validação, o tipo muda, e seu editor avisa onde o código quebrou.
Integração com React Hook Form
A combinação React Hook Form + Zod (via @hookform/resolvers) é a stack definitiva para formulários hoje.
const { register, handleSubmit } = useForm({
resolver: zodResolver(UserSchema)
});
Performance
Zod é leve (8kb gzipped) e não tem dependências. Yup é um pouco maior e menos otimizado para inferência estática complexa.
Veredito: Use Zod. Não há motivo para começar um projeto novo com Yup hoje, a menos que você não use TypeScript (o que seria outro problema).