React Conf 2025 (Día 1)

La semana pasada se llevó a cabo la conferencia React 2025.

En el primer día, las charlas se centraron principalmente en temas relacionados con React.

• React Keynote

  • Anuncios de React 19.1 (Owner Stacks), 19.2 (Activity/useEffectEvent/Partial Pre-rendering) y Canary (View Transitions)
  • Lanzamiento oficial de React Compiler 1.0, con memoización automática y análisis de código
  • Inicio de una gobernanza centrada en la comunidad con la creación de React Foundation

• View Transitions and Activity

  • Con <Activity /> se puede cambiar entre estados visible/hidden sin lift-up de state y con preservación automática del state
  • Con <ViewTransition /> se pueden implementar animaciones declarativas incluso en Server Components
  • Manejo composable y declarative del estado de la UI y las animaciones

• Profiling with React Performance Tracks

  • Desde React 19.2, Chrome DevTools permite visualizar la línea de tiempo de trabajo de React
  • Identificación de cuellos de botella de rendimiento con Scheduler/Components/Server Components Track
  • Se agregó Suspense Panel para visualizar el estado de los Suspense boundary (lanzamiento a finales de 2025)

• In case you missed the memo

  • Sanity Studio memoizó más de 1,000 componentes con React Compiler, logrando en promedio una mejora de rendimiento de 20~30%
  • Posibilidad de optimizaciones finas (suscripción condicional de context, branch memoization) y detección de bugs
  • Se recomienda adoptarlo de inmediato para enfocarse en "Make it work" sin preocuparse por la memoización

• Async React

  • Transitions, Suspense y Server Components son una nueva arquitectura para construir apps asíncronas
  • Suspense, router y caching resuelven el parpadeo de los loading states
  • Coordinación entre data fetching y UI updating con startTransition e integración de animaciones

• React and AI

  • Meta usa AI para corrección de bugs y exploración de código, inyectando contexto con reglas para LLM
  • Enfoque en identificar el contexto correcto y usar la AI como partner de pair programming
  • La API estable de React sirve como base para construir herramientas de AI y abre oportunidades de carrera como AI Engineer

• Exploring React Performance

  • Es importante el equilibrio entre Data Model y Rendering Algorithm, y React Compiler mejora el rendimiento
  • Un enfoque domain-specific supera a los algoritmos incrementales generales
  • Uso de Transitions, Suspense, Virtualization, <Activity /> y Data Modeling

• The invisible craft of great UX

  • Pequeños detalles como click-drag-release, popovers según el OS o el retraso de los tooltips tienen gran impacto en la UX
  • Resolver problemas interpretando la intención del usuario en lugar de solo eventos del DOM, como fijar o teletransportar momentáneamente el cursor durante el scrub
  • Mejora de rendimiento reutilizando múltiples popovers como un solo elemento (de 300 a 1)

• Building an MCP Server for a React Component

  • MCP es un estándar open source para conectar AI con sistemas externos, con un método estandarizado como USB-C
  • AG Grid incrustó 360 mil documentos y los almacenó en Postgres para dar contexto preciso al LLM
  • Soporte para búsqueda en documentación y creación rápida de componentes con Prompts/Resources/Tools

• Why React Native apps make all the money

  • React Native muestra mejores resultados en tasa de conversión de pago, ingresos por instalación y LTV
  • El desarrollo cross-platform permite lanzamientos más rápidos y una estrategia de monetización consistente
  • RevenueCat SDK facilita la monetización con paywalls, analítica y experimentos de precios

• Modern emails using React

  • El desarrollo de email es difícil por la falta de soporte de propiedades CSS y las diferencias de renderizado entre clientes
  • React Email ofrece creación basada en componentes, pruebas de compatibilidad y revisión de enlaces
  • Conversión a HTML con la función Render, y uso de Resend API por parte de empresas importantes

• React team Q&A

  • React Compiler puede adoptarse con seguridad si se siguen las Rules of React; el código nuevo no necesita useMemo/useCallback
  • La AI se usa como partner de pair programming, y la capacidad de diseñar arquitectura es importante
  • Durante 5 años, React Foundation reducirá el rol de Meta y buscará ampliar la comunidad y fomentar un ambiente amable

[nayounsang1]

Gracias

[soaple]

¡Gracias!

[bluekai17]

La actualización de React Native 0.82 también se ve bastante importante.

[soaple]

Sí, así es jaja

Como la mayoría de las presentaciones relacionadas con React Native se dieron el segundo día, creo que te será útil revisar el contenido de las presentaciones del segundo día a continuación.

https://es.news.hada.io/topic?id=23670

[addons]

¡Gracias, estuvo muy bueno!

[soaple]

¡Gracias!

[soaple]

Como la presentación es bastante larga, si tienen curiosidad por el contenido completo, creo que les conviene consultar el artículo del enlace.

¡También voy a resumir y publicar pronto el contenido de las presentaciones del segundo día!