El mapa completo

Las catorce lecciones anteriores son una parte de la escalabilidad frontend, no el todo. Esta es la lista honesta de lo que existe, con una marca de qué mirar primero para esta entrevista y qué puedes dejar para después.

La respuesta corta

Las catorce lecciones cubren cómo se rompe el navegador —datos, red, estado, fronteras—, más la parte de calidad y la de accesibilidad e idioma. Lo que queda fuera es especializado: colaboración multiusuario con CRDT, WebGL, y el detalle fino de operación (trazas distribuidas). Para esta vacante, no es lo que decide.

Familias de problemas

1. Datos y render Cubierto · lecciones 03, 04, 06

Listas y tablas masivas, virtualización, paginación
Filtrado, ordenamiento y búsqueda a escala
Gráficas con presupuesto de puntos y agregación
Media pesada: video, canvas, WebGL, imágenes enormes

2. Red y asincronía Cubierto parcialmente · lección 05 y 08

Cascadas de peticiones, N+1, agrupación, precarga
Caché de datos, invalidación, stale-while-revalidate
Paginación por cursor frente a por desplazamiento
Tiempo real: WebSocket, SSE, reconexión, orden de eventos
Offline y sincronización con conflictos

3. Ingesta y backend visible Cubierto · lección 06

Colas, workers, backpressure, idempotencia
Agregación al escribir y retención por capas
Contratos de API que deciden si la interfaz puede funcionar

4. Estado Cubierto · lección 07

Re-render, identidad de objetos, selectores, contexto partido
Máquinas de estado y uniones discriminadas
Deshacer/rehacer (patrón comando) en editores
Colaboración multiusuario: CRDT y transformación operacional
Normalización de entidades y estado derivado

5. Entrega y renderizado Cubierto · lección 09

SSR, SSG, ISR, streaming, hidratación parcial, islas
Server Components y la frontera servidor/cliente
Edge rendering y personalización por región
Presupuesto de bundle y estrategia de carga

6. Peso y rendimiento Cubierto parcialmente · lección 09

Core Web Vitals: LCP, INP, CLS
Laboratorio (Lighthouse) frente a campo (RUM)
Fuentes, imágenes y precarga
Fugas de memoria: intervalos, suscripciones, iframes
Presupuesto de rendimiento verificado en CI

7. Seguridad y fronteras Cubierto · lección 10

XSS, escape, CSP, cabeceras, confianza cero en el cliente
Aislamiento de contenido de terceros: iframe, sandbox, postMessage
Dónde viven los tokens y por qué no en el almacenamiento del navegador
Cadena de suministro de dependencias

8. Arquitectura y organización Cubierto · lección 11

Capas, fronteras, dirección de dependencias
Monorepo, paquetes, contratos tipados, generación de tipos
Design systems: tokens, versionado, codemods, adopción
Micro-frontends: cuándo sí y por qué casi nunca primero
Proceso: ADRs, RFCs, propiedad de código, tronco común

9. Pruebas y calidad Cubierto · lección 13

Pirámide de pruebas y qué se prueba en cada nivel
Pruebas de contrato entre frontend y API
Regresión visual y su tolerancia
Pruebas inestables (flaky): causas y cómo se erradican
Datos de prueba y aislamiento entre pruebas

10. Observabilidad y operación Cubierto parcialmente · lección 12

RUM, error tracking con contexto, trazas
Feature flags y despliegue progresivo
Experimentación y medición de una función
Paneles que responden "¿está roto ahora mismo?"

11. Accesibilidad e internacionalización Cubierto · lección 14

Accesibilidad como sistema, no como parche final
Teclado, foco, regiones vivas, contraste
i18n: plurales (ICU), formatos, RTL, longitud variable del texto
Zonas horarias y horario de verano

12. IA en el producto Cubierto · lección 12

Streaming, cancelación, estados intermedios, costo
Evaluación con casos conocidos y tasa de rechazo
Fallback a humano y guardarraíles de datos

Orden de estudio para esta vacante

Prioridad	Qué	Por qué
1	Datos, red y estado (lecciones 03–08)	Es el 80% de las preguntas de un frontend senior en producto.
2	Entrega y fronteras (09, 10)	Adtech vive de contenido de terceros: el iframe y la CSP salen seguro.
3	Arquitectura y organización (11)	Es la ronda del hiring manager, aunque se pregunte en forma de "¿cómo trabajas con otros?".
4	Observabilidad (12)	Diferencia a quien ha operado algo de quien solo ha construido.
5	CRDT, transformación operacional, WebGL, trazas distribuidas	Interesante y especializado. Solo si el puesto es un editor colaborativo o un visor 3D.

Prioridad

Qué

Por qué

Datos, red y estado (lecciones 03–08)

Es el 80% de las preguntas de un frontend senior en producto.

Entrega y fronteras (09, 10)

Adtech vive de contenido de terceros: el iframe y la CSP salen seguro.

Arquitectura y organización (11)

Es la ronda del hiring manager, aunque se pregunte en forma de "¿cómo trabajas con otros?".

Observabilidad (12)

Diferencia a quien ha operado algo de quien solo ha construido.

CRDT, transformación operacional, WebGL, trazas distribuidas

Interesante y especializado. Solo si el puesto es un editor colaborativo o un visor 3D.

Lo que NO te van a preguntar

en una entrevista de frontend de producto: cómo implementar un balanceador, Kubernetes, sharding de base de datos, o teoría de compiladores. Si te preguntan por eso, es para ver si finges.

La autoevaluación que sí funciona

Para cada familia, pregúntate: ¿puedo nombrar un caso real donde esto se rompió, cómo lo detecté y qué cambié? Si no puedes, no la sabes todavía — la has leído. La diferencia entre leer y saber es una historia propia por familia.

Cierra el curso

Tres preguntas de cierre.

¿Cuál de estas familias no se puede resolver solo en el navegador?

Listas masivas Tráfico y caché compartida entre usuarios Re-render en cascada

Si tuvieras una sola tarde para preparar una entrevista de frontend senior, ¿qué familia dejarías fuera?

Estado y re-render Fronteras y seguridad CRDT y colaboración multiusuario

¿Qué distingue "haber leído" de "saber" una familia de problemas?

Tener una historia propia: se rompió, lo detecté así, cambié esto Recordar los nombres de las herramientas Haber visto un video sobre el tema