MÓDULO 01
Modelo mental
La función, el árbol y el ciclo trigger → render → commit.
Microscopio de render
Simulación paso a paso de una actualización, desde el evento hasta el píxel.
Salida actual
$500,000
Actualizaciones simuladas1
01
Trigger
setMonto encola
02
Render
se llama la función
03
Commit
se actualiza el DOM
04
Paint
el navegador pinta
Conceptos esenciales
Abre cada bloque y verifica que puedas explicar la regla con tus propias palabras.
Un componente no es una pantalla persistente: es una función que describe cómo debería verse la interfaz para unas props y un estado concretos.
Regla práctica
Mismas entradas + función pura = mismo JSX. No modifiques variables externas durante render.
function Score({ ventas, deuda }) {
const razon = ventas / deuda; // derivado
return <strong>{razon.toFixed(2)}</strong>;
} Punto de control