Son 1025 Pokémon, cada uno con su ficha, y la PokéAPI no está pensada para pedirlo todo a la vez. El reto era que moverse por ella fuera rápido sin pedir más de lo necesario.
Pedir solo la región que ves
Eliges región, de Kanto a Paldea. La lista de nombres se pide una vez y TanStack Query la guarda una hora; la cuadrícula solo muestra la región elegida. La búsqueda filtra esa lista en el navegador, así que los resultados salen mientras escribes.
El filtro por tipo funciona igual: la primera vez se pregunta a la API y la respuesta se guarda 24 horas, porque los tipos no cambian.
La ficha se pide antes del clic
Cada ficha es una petición aparte, así que la empiezo a pedir al pasar el ratón por la tarjeta. Al hacer clic, normalmente ya ha llegado, y queda guardada media hora.
Primero la imagen pequeña, luego la grande
El componente SpriteImg muestra primero el sprite pequeño y lo cambia por la ilustración oficial cuando carga. Si no existe, prueba con la de HOME, y si nada carga, pone un marcador. Quien lo usa solo le pasa un id.
Todo en español, sin peticiones extra
La PokéAPI devuelve muchos nombres solo en inglés, así que añadí tablas propias con unos 600 movimientos y las habilidades, y una de tipos para calcular las debilidades sin otra petición.
Favoritos sin servidor ni login
Los favoritos van en localStorage y se guardan cuando el navegador está libre, con requestIdleCallback, para no frenar la interfaz. Zustand lleva la búsqueda, el tipo y la región. El login me lo ahorré a propósito: para unos favoritos solo sumaba mantenimiento.
Lo que aprendí: decidir qué pedir y cuándo
La velocidad no salió de ningún truco, sino de pedir la lista una vez, la ficha antes del clic y la imagen pequeña antes que la grande.