Guía de entrevista

Preguntas y respuestas de entrevista para desarrollador frontend 2026

Preguntas reales de entrevista para desarrollador frontend en 2026 con notas sobre cómo responder, cubriendo JavaScript, React, CSS, rendimiento y diseño de sistemas.

Guía de entrevista de GhostPilot: Preguntas y respuestas de entrevista para desarrollador frontend 2026

Las entrevistas de frontend en 2026 ya no son solo "monta una lista de tareas y explica los closures". Los equipos de contratación ahora sondean cómo razonas sobre rendimiento de renderizado, accesibilidad, arquitectura de componentes y las contrapartidas de lanzar UI asistida por IA a escala. Esta guía repasa las preguntas a las que te vas a enfrentar de verdad, por qué las hacen los entrevistadores y cómo estructurar respuestas que transmitan criterio de nivel senior.

Qué evalúan realmente las entrevistas de frontend en 2026

El listón se ha movido. Con las herramientas de IA escribiendo ya una parte considerable del código repetitivo, a los entrevistadores les importa menos si recuerdas los métodos de array y más si entiendes qué le hace tu código al navegador, al bundle y al usuario. Espera evaluación en cinco dimensiones.

  • Fundamentos de JavaScript bajo presión: el event loop, los closures, los prototipos y el comportamiento asíncrono, preguntados de formas que revelan si de verdad los entiendes o si solo has memorizado patrones.
  • Profundidad en el framework: normalmente React, aunque siguen existiendo puestos de Vue, Svelte y Angular. Quieren saber cómo funcionan de verdad el renderizado, el estado y la reconciliación, no solo la superficie de la API.
  • Conocimiento del navegador y de la plataforma: el modelo de caja de CSS, el DOM, el layout y el paint, las cascadas de red y las Core Web Vitals.
  • Diseño de sistemas en el cliente: cómo diseñarías una librería de componentes, un dashboard con muchos datos o una app capaz de funcionar sin conexión.
  • Colaboración y sentido de producto: si plantas cara a especificaciones malas, si piensas en accesibilidad y si sopesas la experiencia de usuario frente al costo de ingeniería.

Los mejores candidatos conectan cada respuesta técnica con el impacto en el usuario. Eso es lo que separa a un ingeniero de nivel medio de uno senior a ojos de la mayoría de los entrevistadores.

El proceso de entrevista (las rondas y etapas reales)

Un proceso típico de frontend en 2026 tiene de cuatro a seis etapas:

  1. Filtro con el reclutador (20 a 30 minutos). Logística, expectativas salariales y un vistazo rápido a tu trayectoria. Poco contenido técnico, pero la claridad aquí marca el tono.
  2. Filtro técnico telefónico (45 a 60 minutos). Un ejercicio de programación en vivo en un editor compartido: implementar una función, depurar un fragmento o construir un componente interactivo pequeño. La soltura con JavaScript es la puerta de entrada.
  3. Ronda de programación (60 minutos). Una construcción más grande, a menudo un componente de UI funcional desde cero (un autocompletado, un modal, una valoración con estrellas) en JavaScript puro o en el framework del equipo. Énfasis en la corrección, los casos límite y una manipulación limpia del DOM.
  4. Diseño de sistemas de frontend (45 a 60 minutos). Cada vez más común incluso a nivel medio. Diseñas algo como un feed de noticias o un servicio de typeahead y razonas sobre arquitectura, flujo de datos y caché.
  5. Inmersión profunda en el framework y su ecosistema (45 minutos). Interioridades de React, elecciones de gestión de estado, estrategias de renderizado (CSR frente a SSR frente a streaming) y rendimiento.
  6. Conductual y encaje con el equipo (45 minutos). Proyectos pasados, conflictos y cómo manejas la ambigüedad y las decisiones de accesibilidad.

Las empresas pequeñas lo comprimen en dos o tres rondas. Las grandes hacen el proceso completo.

Las preguntas

JavaScript y el navegador

1. Explica el event loop, incluida la diferencia entre microtareas y macrotareas. Cómo abordarla: Recorre la pila de llamadas, la cola de tareas y la cola de microtareas. Demuestra que las promesas y queueMicrotask se resuelven antes que los callbacks de setTimeout , y luego usa un ejemplo corto que imprima en un orden poco obvio y explica la secuencia.

2. ¿Cómo obtiene su valor this , y cómo cambian eso las funciones flecha? Cómo abordarla: Explica que this lo fija el sitio de llamada en las funciones normales (por defecto, implícito, explícito, new) y de forma léxica en las funciones flecha. Menciona un bug real que esto provoca, como perder this al pasar un método como callback.

3. ¿Qué es la delegación de eventos y por qué es útil? Cómo abordarla: Describe que se pone un único listener en el padre y se usa event.target para manejar a los hijos. Átalo al rendimiento (menos listeners) y al contenido dinámico (funciona con elementos añadidos después).

4. Explícame cómo aplicarías debounce a un campo de búsqueda. Cómo abordarla: Escribe de memoria, apoyándote en closures, la función debounce , luego contrástala con el throttling y di cuándo encaja cada uno. Extra: cancela el temporizador al desmontar para evitar fugas de memoria.

Frameworks (centrado en React)

5. Explica la diferencia entre useMemo, useCallback, y React.memo. Cómo abordarla: useMemo cachea un valor calculado, useCallback cachea una referencia a una función, y React.memo evita volver a renderizar un componente cuando las props son iguales en una comparación superficial. Recalca que memoizar de forma prematura es un antipatrón habitual y que mides antes de recurrir a ello.

6. ¿Cómo gestionarías la obtención de datos en una app de React en 2026? Cómo abordarla: Habla de server components y streaming donde el framework los soporte, más librerías de cliente para caché, deduplicación y comportamiento stale-while-revalidate. Demuestra que sabes que hacer fetch dentro de un efecto es un recurso de último momento, no la opción por defecto.

7. ¿Qué provoca renderizados innecesarios y cómo los diagnosticas? Cómo abordarla: Menciona nuevas referencias de objeto o función en las props, valores de contexto inestables y estado colocado demasiado arriba en el árbol. Nombra el Profiler de React DevTools como tu herramienta de diagnóstico.

8. ¿Cuándo recurrirías a una librería de estado global en lugar de a contexto o estado local? Cómo abordarla: Estado local primero, contexto para valores transversales de baja frecuencia (tema, autenticación) y un store dedicado para estado compartido complejo o que cambia mucho. Señala que el contexto vuelve a renderizar a todos sus consumidores, que es justo por lo que no sirve para datos que cambian rápido.

CSS, accesibilidad y rendimiento

9. Explica la diferencia entre Flexbox y Grid, y cuándo usarías cada uno. Cómo abordarla: Flexbox para maquetaciones de una dimensión (una fila o una columna), Grid para maquetaciones de dos dimensiones. Da un ejemplo concreto: una barra de navegación con Flexbox, una galería de tarjetas con Grid.

10. ¿Qué son las Core Web Vitals y cómo mejorarías un LCP malo? Cómo abordarla: Define LCP, CLS e INP (que sustituyó a FID). Para el LCP, habla de precargar la imagen principal, optimizar la cadena de peticiones críticas, el tiempo de respuesta del servidor y evitar recursos que bloqueen el renderizado.

11. ¿Cómo haces accesible un desplegable personalizado? Cómo abordarla: Navegación por teclado (flechas, Escape, Enter), roles y estados ARIA correctos (aria-expanded, aria-activedescendant), gestión del foco y anuncios para lectores de pantalla. Esto separa a quienes dicen "la accesibilidad importa" de quienes la han construido de verdad.

Diseño de sistemas de frontend

12. Diseña un componente de typeahead o autocompletado usado por millones de usuarios. Cómo abordarla: Aclara primero los requisitos y luego cubre peticiones con debounce, caché en cliente y servidor, cancelación de peticiones obsoletas, accesibilidad por teclado, ranking y un manejo elegante de los fallos de red. Dibuja el flujo de datos.

13. ¿Cómo diseñarías una librería de componentes reutilizable para varios equipos de producto? Cómo abordarla: Habla de una capa de design tokens, componentes headless frente a componentes con estilos, versionado y estrategia ante cambios que rompen compatibilidad, documentación y tree-shaking para que quien la use solo envíe lo que consume.

14. Diseña un feed con scroll infinito. Cómo abordarla: Cubre la virtualización (renderizar solo los elementos visibles), paginación frente a carga basada en cursor, restauración del scroll, carga diferida de imágenes y preservar la accesibilidad para quien usa teclado y lector de pantalla.

Errores habituales que hunden a los candidatos de frontend

  • Lanzarse a programar sin aclarar los requisitos. Tanto en las rondas de código como en las de diseño, lo primero que hace un buen candidato es preguntar. El silencio y ponerse a teclear de inmediato suena a junior.
  • Ignorar por completo la accesibilidad. En 2026 esto es lo mínimo exigible. Un widget interactivo sin soporte de teclado ni ARIA te va a costar caro, aunque el resultado visual sea perfecto.
  • Memoizar todo "por rendimiento". Espolvorear useMemo y useCallback sin medir delata ingeniería de culto al cargo, y los entrevistadores lo notan.
  • Pasar de puntillas por el event loop. Decir "es asíncrono" no es una respuesta. Si no puedes predecir el orden de los logs, se nota.
  • Descuidar los casos límite. Los estados vacío, de carga y de error, además de la entrada rápida de texto, son justo donde hurgan los entrevistadores. Cúbrelos sin que te lo pidan.

Cómo prepararte

Empieza por los fundamentos, porque sostienen todo lo demás. Sé capaz de implementar de memoria debounce, throttle, un retardo basado en promesas y un emisor de eventos básico. Reconstruye tres o cuatro componentes de UI clásicos (modal, pestañas, autocompletado, acordeón) con soporte completo de teclado y ARIA, en JavaScript puro y en tu framework preferido.

Para la ronda de framework, lee la documentación oficial sobre renderizado y reconciliación en vez de fiarte del conocimiento de tutoriales, y perfila una app real para poder hablar desde la experiencia sobre cómo diagnosticar renderizados. Para el diseño de sistemas, practica en voz alta: elige una UI conocida y recorre requisitos, flujo de datos, caché y contrapartidas. Las entrevistas de práctica importan más que la lectura pasiva, así que grábate, mira dónde te atascas y aprieta esos puntos.

Dónde ayuda un copiloto en vivo

Cuando llega la entrevista en vivo, un copiloto en tiempo real quita presión en los momentos más tensos. GhostPilot AI escucha la conversación y muestra sugerencias casi instantáneas en el panel lateral de Chrome: un aviso para aclarar los requisitos antes de programar, un recordatorio de los atributos ARIA que necesita un desplegable o una forma estructurada de plantear una respuesta de diseño de sistemas. Como funciona en el panel lateral, no forma parte de la captura de pantalla de una pestaña compartida, y la app de escritorio opcional para Windows es invisible a la captura de pantalla en Windows 10 (build 2004 o posterior) y Windows 11. Tómalo como una red de seguridad para cuando los nervios te dejen en blanco con el nombre exacto de un hook o de una Web Vital, no como sustituto de una preparación de verdad.

FAQ

¿Cuánto tiempo debería prepararme para una entrevista de desarrollador frontend? Para un puesto de nivel medio, de tres a cuatro semanas de práctica enfocada es realista si ya trabajas en el sector. Los puestos senior con ronda de diseño de sistemas suelen pedir de seis a ocho semanas, sobre todo para coger soltura articulando arquitectura en voz alta.

¿Las entrevistas de código para frontend siguen siendo al estilo LeetCode en 2026? Algunas empresas siguen incluyendo preguntas de algoritmos, pero la tendencia va con fuerza hacia la construcción práctica de UI y problemas centrados en el DOM. Espera "construye este componente" mucho más a menudo que "invierte un árbol binario". Repasa las estructuras de datos básicas, pero carga tu preparación hacia el trabajo real de frontend.

¿Necesito saber un framework o basta con JavaScript puro? Un JavaScript puro sólido es la base, y los entrevistadores lo evalúan directamente. Dicho eso, la mayoría de los puestos esperan soltura en al menos un framework (normalmente React), y la ronda de inmersión profunda da por hecho que entiendes cómo funciona por dentro, no solo su API.

¿Cuál es el motivo más común de rechazo de los candidatos de frontend? Dominan dos: no aclarar los requisitos antes de programar e ignorar la accesibilidad y los casos límite. Ambos delatan falta de madurez de producción aunque la lógica central sea correcta.

¿Cuánto importa el diseño de sistemas en los puestos de frontend que no son senior? Más de lo que importaba antes. Incluso los procesos de nivel medio incluyen ya una ronda de diseño reducida. No vas a diseñar backends distribuidos, pero deberías razonar con soltura sobre arquitectura de cliente, caché y estrategia de renderizado.

Prueba GhostPilot AI

Empieza gratis y sube de plan solo si se lo gana: el plan gratuito te da sesiones en vivo de 10 minutos con respuestas de IA ilimitadas, un Session Pass cuesta $29 por tres entrevistas completas de dos horas (pago único, sin suscripción) y Pro son $59/mes o $192/año ($16/mes con facturación anual). Más información en ghostpilotai.com.

Consigue GhostPilot en la Chrome Web Store

Practícalas una por una. Cada pregunta de este puesto tiene su propia página con una respuesta directa, notas de estructura y un ejemplo hablado.

Abrir el banco de preguntas

Prueba GhostPilot en tu próxima entrevista

El plan gratuito incluye transcripción en vivo de la entrevista y respuestas con IA. Sin tarjeta de crédito.

¿No sabes qué te van a preguntar? Pega la descripción del puesto en el Question Predictor gratuito y obtén al instante las veinte preguntas más probables.

Instala la extensión de Chrome