Next.js desde Cero (App Router)
Texto Leccion
Performance: menos JS, mejores Core Web Vitals
Performance Performance es conversion. Aprende prioridades: reduce JS, optimiza imagenes y evita render bloqueante. Conceptos clave Server components por defecto next/image (cuando aplica) Evitar animaciones pesadas sin reduced-motion Ejemplo Regla: si algo es decorativo, que no sea JS pesado. Ejercicio Revisa 1 pagina y elimina una dependencia client innecesaria. Agrega soporte a prefers-reduced-motion (si hay animaciones). Checklist de mastery Uso server-first. Pienso performance como feature.
Tiempo de estudio
15 Min
Performance
Performance es conversion. Aprende prioridades: reduce JS, optimiza imagenes y evita render bloqueante.
Conceptos clave
- Server components por defecto
- next/image (cuando aplica)
- Evitar animaciones pesadas sin reduced-motion
Ejemplo
Regla: si algo es decorativo, que no sea JS pesado.
Ejercicio
- Revisa 1 pagina y elimina una dependencia client innecesaria.
- Agrega soporte a prefers-reduced-motion (si hay animaciones).
Checklist de mastery
- Uso server-first.
- Pienso performance como feature.
Texto Lessons
#1
Routing y layouts: estructura clara
#2
Data fetching: cuando cachear y cuando no
#3
Metadata: titles, canonical, OG y Twitter
#4
Landing + CTA: copy y estructura
#5
Server vs Client Components: regla practica
#6
Server Actions: forms sin API extra
#7
Sitemap y robots: indexar lo correcto
#8
Blog: posts, RSS y enlaces internos
#9
Loading, error y not-found: UX profesional
#10
Auth basica: proteger rutas y acciones
#11
Performance: menos JS, mejores Core Web Vitals
#12
Deploy checklist: que mirar antes de lanzar
Ver full lessons
Revisar curso learning pagina
