Usa useRef cuando necesites un valor mutable que sobreviva a los renders pero que no deba provocar ninguno: un nodo del DOM, el id de un temporizador, el valor anterior de una prop, un flag que registre si algo ya se ejecutó. Usa useState cuando el valor deba aparecer en la UI, porque escribir en una ref no programa ningún render. La regla práctica es simple: si la pantalla debe cambiar, es estado.
Por qué lo preguntan los entrevistadores
Es una lectura rápida de si entiendes el ciclo de render. El entrevistador quiere oír primero la diferencia sobre qué dispara un render, y después instintos correctos sobre cuándo una ref es la herramienta adecuada. Suele preguntar después por leer o escribir refs durante el render, que es donde tropieza quien solo usa refs para nodos del DOM, y donde importa la distinción entre lo mutable y lo renderizado.
Cómo estructurar tu respuesta
- Empieza por la diferencia que importa: las refs no disparan renders.
- Enumera los tres o cuatro usos legítimos de una ref.
- Da la regla práctica para elegir.
- Menciona que las refs no deberían leerse ni escribirse durante el render.
Ejemplo de respuesta
La línea divisoria es si cambiar el valor debería repintar la pantalla. El estado sí, una ref no. Así que en una ref pongo todo lo que es contabilidad y no UI: el nodo del DOM que necesito enfocar o medir, el id de un intervalo que tengo que limpiar al desmontar, el último valor de una prop para poder comparar, un flag de si ya hice esto. El error clásico es guardar algo en una ref y preguntarse por qué la UI no se actualiza nunca, y la imagen espejo es meter la posición de scroll en el estado y renderizar con cada evento de scroll. También mantengo la regla de no leer ni escribir refs durante el render, solo en efectos y manejadores de eventos, porque durante el render React espera que la función sea pura y una lectura de ref puede darte valores distintos entre pasadas. Un cambio agradable de React 19 es que ref ya es una prop normal para los componentes de función, así que dejé de envolver cosas en forwardRef.
¿Tienes esta entrevista a la vuelta de la esquina? GhostPilot escucha tu llamada en vivo, detecta la pregunta en cuanto la hacen y pone una respuesta estructurada en tu pantalla en tiempo real. Pruébalo en tu próxima entrevista de práctica, o coge un Session Pass de $29, sin suscripción, para la de verdad.
Mira cómo funcionaPreguntas de seguimiento que puedes esperar
- ¿Cómo obtendrías el valor anterior de una prop?
- ¿Por qué no deberías leer ni escribir una ref durante el render?
- ¿Cómo se pasa una ref a un componente hijo en React 19?
Más preguntas para Desarrollador React
Tu entrevistador hará su propia versión de esta. Pega la descripción real del puesto en el Question Predictor gratuito y obtén las 20 preguntas que ese puesto tiene más probabilidades de hacerte, con lo que cada una busca en realidad.
Predecir mis preguntas