Panel de código en vivo — lo que ves, mientras lees
El panel "hecho mientras lees" en la homepage es código real, ejecutándose. Aquí está cómo funciona el canvas en vivo + token stream — y lo que aprendimos afinándolo para repaint sub-100ms.
Si pasaste por la homepage y notaste un panel de código corriendo discretamente mientras leías — sí, está realmente renderizando. No es un video en loop. No es un gif. JS en vivo golpeando un canvas, repintando en requestAnimationFrame, con el código fuente escribiéndose solo al lado.
La parte difícil no fue el canvas. Fue conseguir que ambos paneles se leyeran como un solo pensamiento: código a la izquierda produciendo output a la derecha, ambos actualizándose sincronizados, ambos legibles a velocidad de scroll. Aterrizamos en un token-streamer que ritma el emit de caracteres para coincidir con los frames de repaint del canvas, más una pequeña DSL para declarar "esta línea renderiza este frame".
Lecciones: 60fps está bien, pero el ojo humano lee 4–6 caracteres por ciclo de repaint — demasiado rápido y el panel de código se vuelve papel pintado, demasiado lento y el canvas se atrasa. Aterrizamos en ~6 chars / 16ms. Se sintió correcto después de una semana mirándolo.