¿Está React Realmente Muriendo?

This ad is not shown to multipass and full ticket holders
JSNation US
JSNation US 2025
November 17 - 20, 2025
New York, US & Online
See JS stars in the US biggest planetarium
Learn More
In partnership with Focus Reactive
Upcoming event
JSNation US 2025
JSNation US 2025
November 17 - 20, 2025. New York, US & Online
Learn more
Bookmark
Rate this content

Hablaremos sobre cómo React en sí mismo está agregando nuevas características de manera constante y empujando los límites de las bibliotecas de renderizado. También, sobre el ecosistema y cómo se está expandiendo constantemente. 


This talk has been presented at React Advanced 2024, check out the latest edition of this React Conference.

Jack Herrington
Jack Herrington
29 min
25 Oct, 2024

Comments

Sign in or register to post your comment.
Video Summary and Transcription
¿Está React realmente muriendo? React está muerto. Echemos un vistazo a los números. Svelte está obteniendo 1.5 millones de descargas por semana. Angular está alcanzando 3.5. Probablemente no sea un competidor con React. React eclipsa a todo con 25 millones de descargas a la semana. React es increíblemente popular con 4 millones de usuarios y desarrolladores. A pesar de algunas críticas, una encuesta muestra que al 71% de los encuestados les gustó React, mientras que solo al 28% no. La flexibilidad y las opciones de React pueden ser abrumadoras para los principiantes. La complejidad de React ha aumentado, causando confusión para los principiantes. La gestión de memoria, la arquitectura demasiado complicada y la fatiga de la innovación son desafíos comunes en React. React 19 se retrasa debido a problemas de suspense. Los componentes del servidor de React son una innovación favorita. El modelo de hidratación de Qwik es genial. Qwik es increíble, y sería genial ver algo así para React. La IA puede ayudarte a llegar al 80%, pero aún necesitas un desarrollador real para ajustar y limpiar el código. Tab AI mantiene tu flujo de trabajo en marcha. La popularidad de React es innegable. El impulso detrás de React es fuerte, y es poco probable que desaparezca pronto.
Available in English: Is React Really Dying?

1. React's Popularity and Competition

Short description:

¿React está realmente muriendo? React está muerto. Echemos un vistazo a los números. Svelte está obteniendo 1.5 millones de descargas por semana. Angular está alcanzando 3.5. Probablemente no sea un competidor con React. Esta es la pequeña aplicación que escribí, ¿y adivina qué? En React, ¿verdad? No usé HttpGrid.

Está bien. De acuerdo. Sí. ¿React está realmente muriendo? En llamas. El logo de React. Así que todos ustedes aprendieron mucho React avanzado hoy, ¿verdad?

Sí. De acuerdo. Resulta que nada de eso importa porque irás a X, o irás a mi flujo de comentarios en YouTube, este es el tipo de cosas que obtienes. React está muerto. Loco, ¿verdad? Bueno, tal vez, no lo sé. Soy el tipo de persona que realmente quiere averiguarlo. Así que pienso, bueno, tienen que ir a algún lado, ¿verdad? Y no están haciendo React. Pueden hacer Svelte, solid view, Angular tal vez.

Así que también soy un tipo de números. Tal vez lo averigüe. Así que echemos un vistazo a los números. Así que comencemos con Svelte. Veamos cómo le va a Svelte. Está bien. Bueno, Svelte está obteniendo 1.5 millones de descargas por semana. Eso es realmente bueno. Si estás ejecutando un proyecto de código abierto y estás obteniendo 1.5 millones de descargas a la semana, lo estás haciendo bastante bien, ¿verdad? Absolutamente. De acuerdo. Probemos con Angular. ¿Cómo le va a Angular? Oh, Angular está alcanzando 3.5. No está mal, pero un poco de nivelación allí. Algo interesante en los últimos años. Así que definitivamente diría que probablemente no sea un competidor con React. De acuerdo. ¿Qué tal Vue? Y por cierto, esta es como la pequeña aplicación que escribí, ¿y adivina qué? En React, ¿verdad? Por supuesto. No usé HttpGrid.

2. React's Dominance and Framework Comparison

Short description:

Eso fue un gráfico de AD. Lo siento por eso. Vue lo está haciendo bastante bien. React eclipsa todo con 25 millones de descargas a la semana. React tiene dos veces y media más descargas que todos los demás frameworks combinados. Hablemos de Next, Nuxt, React Router y comparemos esos con cómo están haciendo otros frameworks. Increíble. 4.4 veces el número. React Router es una gran parte de esto. SPA es React Router. Next es SSR.

Eso fue un gráfico de AD. Lo siento por eso. Debería la próxima vez.

Está bien. Así que eso es Vue. Lo está haciendo bastante bien. Creo que podría ser competitivo con React, pero ¿ustedes creen que es competitivo con React?

Está bien. Veamos. React eclipsa todo. 25 millones de descargas a la semana. Estoy loco. Así que en realidad estaba como, bueno, tal vez eclipsa todo. Así que lo sumé todo. Todo React versus todo lo demás, literalmente cualquier otro framework. Y React tiene dos veces y media más descargas que cualquier, todos los otros frameworks combinados. Loco. ¿Verdad?

Así que hablemos de, bueno, en realidad, React es la biblioteca. Hablemos del framework. Así que hablemos de Next y Nuxt y todo eso y comparemos esos, porque eso es, ya sabes, cuando pones esto en acción, es mind the gap. Hay, no hay React como algo independiente. Necesitas agregarle algo. Así que vamos a comparar los frameworks. Así que vamos a tomar como Next y React Router y comparar esos con cómo Nuxt y todos los otros como Speltkit y todo eso, ¿cómo lo están haciendo? Increíble. 4.4 veces el número. De hecho, en realidad diría que React Router es una gran parte de esto. React Router obtiene muchas descargas. Básicamente tienes el SPA que va a ser React Router. Next va a ser tu SSR. Está bien. Pero no es solo que somos nosotros.

3. React's Popularity and Developer Feedback

Short description:

React es increíblemente popular con 4 millones de usuarios y desarrolladores. A pesar de algunas críticas, una encuesta muestra que al 71% de los encuestados les gustó React, mientras que solo al 28% no. Este feedback es muy positivo para nuestro framework, que es utilizado por una comunidad grande y solidaria.

Somos nosotros descargando las herramientas de desarrollador de React. 4 millones de usuarios. Son 4 millones de desarrolladores. Es increíble. Así que con toda esta popularidad. Sí. ¿Está muerto? Tal vez, pero aún apesta, ¿verdad? Eso es otra cosa que escucho. Estaba muerto o apestaba. Bueno, decimos, está bien, tienes todas estas cosas. No usas esto. Escribiste use, use solid, todas estas cosas son mejores que eso. Entonces, ¿los desarrolladores de React piensan que React apesta? Bueno, en realidad hicimos una encuesta para eso. Tuvimos el estado de JS, 2023. Todos tomen el estado de JS. Está bien. Bien, está bien. Está bien. Realmente deberías. Estas son encuestas fantásticas. Realmente ayudan a la gente a entender hacia dónde va la comunidad. Y la comunidad en este caso realmente está gustando React. El 71% de los encuestados dice que si ellos, bueno, que ellos conocían React uno. Y que les gustaba React. El 28% dijo que no les gustaba React. Así que alrededor de tres y tres cuartos. Eso es realmente bueno para nuestro framework. Esa es nuestra biblioteca. Son 4 millones de usuarios. Es increíble. Puedes comparar eso con Vue.

4. Satisfacción de Usuarios de React y Comparación de Frameworks

Short description:

React es muy apreciado y utilizado por los desarrolladores. La encuesta State of React 2023 muestra que solo el 12% de los encuestados tuvo algún comentario negativo sobre React. Además, React ha sido consistentemente clasificado como el framework más positivo a lo largo del tiempo. Estos factores indican que React es una tecnología muy valorada y deseable.

Puedes llevar eso a Angular. El único que realmente se acerca es Smelt. Tiene aproximadamente el mismo número de. Reseñas positivas entusiastas, pero la gran diferencia aquí es que el tipo de azul claro es un gráfico muy extraño. Debo decir, pero la gente en realidad no está usando Salt. Lo conocen, pero en realidad no lo usan. Mientras que con React, lo usan y les gusta.

¿Eso los describe a ustedes? ¿Les gusta y usan React? Absolutamente. Bien. Gracias.

Bien. ¿Qué hay de los puntos de dolor? Así que también estaba el State of React 2023. Salió. Como apenas al final de 2023. Um, y hay algo interesante aquí, ¿verdad? Miras ese gráfico y piensas, wow. La gente tiene todo tipo de problemas como Ford refs y memo y rendimiento. Bueno, lo que la gente no nota es allá abajo en la pequeña letra fina al final. Dice que solo 1500 personas de las 13,000 que tomaron la encuesta dijeron que odiaban algo sobre React. Eso es solo el 12%. Es en realidad menos de lo que vimos antes con el State of JS y volviendo al State of JS desde que se lanzó en 2016, la gente lo ha clasificado como el número uno, el framework más positivo a lo largo del tiempo. Y eso es increíblemente impresionante.

Muy bien. Un último gráfico para ustedes. Tan admirado y deseado. Esto es de Stack Overflow. Tienen una forma muy interesante de pensar sobre esto, pero vamos a echar un vistazo al top React, en general, un sentimiento increíblemente positivo. El siguiente día esencia tercero en la línea. Todas estas cosas negativas sobre estos frameworks. A la gente realmente le gusta. Creo que eso es algo cuando piensas en todas estas cosas que aprendiste hoy, solo piensa en que estás invirtiendo en una tecnología realmente buena que a la gente realmente le gusta.

5. React's Flexibility and Overwhelming Choices

Short description:

La flexibilidad y las opciones de React pueden ser abrumadoras para los principiantes. Desde elegir diferentes opciones de renderizado hasta bibliotecas de componentes y gestores de estado, la variedad de opciones puede ser intimidante. Sin embargo, comprender y seleccionar las herramientas adecuadas puede mejorar significativamente la experiencia de desarrollo.

Muy bien. Así que también aprende que cuando pones React con botas, obtienes una imagen muy espeluznante, una imagen extraña en AI o en Leonardo AI en este caso. Así que aún no está muerto. De hecho, quiero uno de estos, porque son realmente geniales. Tiene como una especie de cosa plástica.

Muy bien. Entonces, ¿qué está pasando aquí, verdad? Entonces, esta es, esta es una diferencia extraña entre estas cosas. Tienes un marco increíblemente positivo que todos están usando y tienes a todas estas personas por ahí diciendo, ah, ya sabes, está muerto. Es esto y aquello. Así que como YouTuber, tengo la oportunidad de hablar mucho con la gente sobre los problemas que tienen en el flujo de comentarios. Y obtuve algunas ideas. Así que tengo tres categorías básicas.

Sí. Y una boca seca de cosas que a la gente no le gustan, o los problemas que la gente está teniendo con React. El primero es que están simplemente abrumados por la cantidad de cosas que tienes que elegir cuando comienzas a trabajar con React. Entonces, ¿cuáles serían esas? El renderizado, ¿verdad? Tienes que elegir. ¿Vas a usar renderizado del lado del servidor, Klaison, SSG, generación de estado estático, generación de sitios incremental? Hay tantas opciones para elegir. ¿Vas a usar una biblioteca de componentes? ¿Vas a usar Mui, como están abajo en el patio. ¿Vas a usar ShadCN, Tailwind? ¿Algún fan de ShadCN por aquí? Sí. Bien. Genial. Gestores de estado. ¿Alguien ha usado Sushdand? ¿Qué tal Zustand? Tengo curiosidad, en realidad. ¿Es Sushdand o es Zustand? Bien. ¿Sushdand? Sí. Sí. ¿Qué tal Zustand? Oh, bien. He escuchado eso. Hice un video sobre Zustand en los primeros días y dije Zustand porque soy estadounidense.

6. Choosing the Right Tools in React

Short description:

Elegir las herramientas adecuadas en React puede ser abrumador con tantas opciones disponibles. Desde la capa de API hasta la capa de persistencia, la estructura del proyecto y los estándares de linting, cada elección importa. Sin embargo, está bien cometer errores. La programación defensiva y adaptarse al cambio son clave para construir una aplicación React saludable.

Lo digo de esa manera. Y los alemanes salieron y dijeron, no, no, no, no. No puedes decirlo de esa manera. Tienes que decir Sushdand. Así que aprendí eso. Y ahora todos están como, Zustand? Como, ¿qué estás diciendo? Muy bien. ¿Qué vas a usar para una capa de API? ¿Vas a usar un estándar de API? ¿Vas a usar gRPC, GraphQL, gRPC? Dios no lo quiera. Lo siento por eso. Por favor, no uses eso. Uh, ¿REST? Si usas gRPC, usa twerp. Es realmente genial. Es de Twitch. En realidad lo hace medianamente aceptable de usar.

Una capa de persistencia. ¿Vas a usar Prisma? ¿Vas a usar, vas a ir directamente a la base de datos? ¿Cómo vas a almacenar tus datos? Y luego, ¿cómo vas a estructurar tu proyecto? ¿Va a ser un mono-repo? ¿Vas a compartir código? ¿Vas a usar estándares de linting? ¿Qué estándares de linting vas a usar? Quiero decir, todo es una elección y hay frameworks por ahí que son realmente agradables en el sentido de que toman muchas de esas decisiones por ti. Como Angular es un ejemplo clásico, pero React teniendo sus raíces en trabajar en cualquier entorno que tengas y reemplazando tu modelo de gestión de vistas existente, básicamente dijo, bueno, depende de ti, lo cual es en realidad bastante genial, pero también intimidante porque podrías elegir mal, pero estoy aquí para decirte que elegir mal está bien.

Así que basado en mi experiencia, puedo decirte, lo primero que quiero hacer es usar programación defensiva, ¿verdad? Si vas a comprometerte con algo, intenta asegurarte de que puedas aislarlo tanto como puedas. Hablamos de un gestor de estado. Así que tienes algo de lógica de negocio genial en tu gestor de estado. Tienes que decidir cómo poner cosas en un carrito o algo así. Desconéctalo del mecanismo de gestión de estado lo mejor que puedas. Para que si decides más adelante que quieres cambiar tu gestor de estado a Tushdan desde otra cosa, entonces puedas hacerlo. Otra cosa es que el cambio, que las cosas cambian, va a ser parte de el proceso de una aplicación saludable. Así que podrías, debido a que las especificaciones pueden cambiar, podrías conseguir un nuevo cliente genial que diga, Oh, tiene mgraphql en él. Y luego tienes que, cuánto velocidad en eso. Así que eso es parte del proceso. Tienes que asegurarte de que lo construyes. Y luego, a medida que las cosas cambian, tienes que priorizar ponerte al día con eso. Así que si quieres pasar de, ya sabes, 4.1 a 4.2 genial, pero no lo priorices demasiado. No quieres que lo único en tu deuda técnica sea actualizar tu package, Jason todo el tiempo.

7. React's Complexity and Strategies

Short description:

La complejidad de React ha aumentado, causando confusión para los principiantes. Las ideas erróneas sobre la mecánica de re-renderizado y la idea de la plantilla mágica pueden ser desafiantes. Comprender los efectos, la programación asincrónica, el renderizado cliente-servidor y la gestión de estado es crucial. Muchos luchan con la complejidad de usar Redux en un contexto de Next.js. Para superar estos desafíos, es importante tener un sólido entendimiento de los fundamentos de React, el renderizado y los conceptos de JavaScript/TypeScript.

Muy bien. Así que el número dos está a mitad de camino. Así que React se ha vuelto demasiado complejo. ¿Alguien ha escuchado esto de la gente? Oh, es demasiado complejo. Solía ser la simple declaración, la simple biblioteca de vistas. Se ha vuelto loco. Así que una de las cosas que escucho en términos de complejidades son las mecánicas de re-renderizado. Así que cuando piensas cuando hablas con tus equipos y hablas con la gente que está empezando a usar React, he hecho muchos videos sobre las mecánicas básicas de React. Y esto es en lo que mucha gente se queda atascada. Hay una cosa que llamo como la idea de la plantilla mágica, que es que la declaración de retorno de esa función. Y el componente es de alguna manera una plantilla mágica que automáticamente se vuelve a ejecutar, pero el código por encima de ella no. Así que estas son cosas que mucha gente, cuando recién están comenzando con React aprenden y están y están equivocados. Así que necesitan averiguar cómo superar eso. O averiguar cuál es la manera correcta. Efectos con use effect y también programación asincrónica. Ese es un gran punto de dolor para la gente. Y también este, lo escucho todo el tiempo sobre el renderizado cliente-servidor y también la gestión de estado. Y la confusión entre los dos. ¿Cómo se ve ciertamente la gestión de estado en el servidor? ¿Cómo se sincroniza eso con lo que está en el cliente? Algunas personas piensan que hay una conexión continua real entre esas dos cosas. No la hay. El año pasado, estuve aquí hablando sobre la conexión entre, creo que fue Redux y Next.js y cómo usar correctamente Redux en un contexto de Next.js. Es complicado. Realmente lo es. Así que resolver todo eso es realmente importante. O eso es con lo que la gente lucha.

Así que déjame contarte un par de estrategias que uso o recomendaciones que tengo para ti. Una es conocer esos fundamentos de React a la perfección. Como el renderizado, el modelo de renderizado, cómo los componentes se re-renderizan, cuándo los componentes se re-renderizan, qué desencadena un re-renderizado, qué no desencadena un re-renderizado. Tienes que conocerlos a la perfección. También entender JavaScript y TypeScript, como en particular, cómo funcionan los objetos y arrays.

8. React's Challenges and Coping Strategies

Short description:

La gestión de memoria, la arquitectura sobrecomplicada y la fatiga de innovación son desafíos comunes en React. Comprender la gestión de memoria y simplificar la arquitectura puede ayudar a evitar errores y código innecesario. El framework de React puede parecer acelerado, pero en realidad proporciona tiempo para integrar nuevas características como hooks. Adopta nuevos frameworks como 'one', pero no te sientas presionado a usarlos de inmediato. Tener conciencia de las nuevas tecnologías es valioso, incluso si no son aplicables inmediatamente a tus proyectos.

Muchos se confunden con la gestión de memoria, objetos, arrays, particularmente objetos anidados, donde pueden mutar un valor bastante anidado dentro de un objeto y se quedan. Whoa, se asustan cuando, oh, lo cambié aquí y de alguna manera se copió allá. ¿Qué está pasando? Y así hice un video completo solo sobre gestión de memoria, como volviendo a lo más básico de cómo una computadora organiza la memoria y cómo eso realmente cambia y cómo realmente funciona dentro de JavaScript. Eso es un gran problema porque la gente, cuando pasa por el bootcamp, eso no es algo que aprendes. Y es algo que terminas aprendiendo al frustrarte increíblemente cuando te encuentras con errores con ello. Y luego otra cosa que veo es que la gente sobrecomplica su arquitectura. Traen todo tipo de librerías cuando no las necesitan. Así que comenzarán con Vite y fue solo, sí, no soy un par de gestores de estado o lo que sea, porque todos los usan y antes de que, te das cuenta, tienen como demasiado código y no tienen idea de qué demonios hace una muñeca. Otra cosa que vemos mucho, o la última que veo mucho es la fatiga de innovación. El framework parece que se está moviendo demasiado, demasiado, demasiado rápido, pero si miras la línea de tiempo, en realidad no se está moviendo tan rápido. Obtuvimos hooks en 2019. Obtuvimos RSC en 2022. Eso son tres años para poder trabajar con hooks e integrarlos en tu sistema. Todavía recibimos todo esto, ya sabes, oye, las cosas se están moviendo demasiado rápido. Como hice un video recientemente llamado, ¿es one el uno? Ahora, one es un framework realmente genial. Es un framework único que puedes usar para construir aplicaciones web y aplicaciones móviles en React Native desde una sola base de código. Es realmente increíble. Hice un video sobre ello. Lo mostré, mostré a la gente cómo funciona. Lo que obtengo. Tantos. Oh, tenemos otro tipo de framework, pero esto es realmente genial. Así que como un ingeniero mayor, he estado haciendo esto durante como 40 años ahora. Aprender a lidiar con la innovación ha sido algo que ahora puedo transmitirles. Así que aquí hay un par de consejos que tengo para ustedes primero. No te asustes cuando alguien te muestre algo realmente genial, como todas estas cosas geniales que aprendiste hoy, puede que no las necesites. Puede que no las uses de inmediato. Así que no te sientas como, oh hombre, aprendí sobre esto. Así que tengo que usarlo de inmediato. Puede que no sea apropiado para tu proyecto, pero entender que está ahí afuera, te ayudará a pensar en cosas como podría.

9. Adopting New Features and React's Governance

Short description:

Considera los aspectos positivos de adoptar nuevas características y frameworks en React. Busca la motivación subyacente detrás de las nuevas incorporaciones y asegúrate de que se alineen con tus objetivos. Usa pruebas de concepto para evaluar la compatibilidad antes de integrarlas en tu aplicación. La continua innovación de React demuestra su naturaleza intrépida. A pesar de ser una biblioteca de 11 años, React sigue siendo prevalente y es la primera opción para construir gestores de estado y frameworks. Sin embargo, la gobernanza es necesaria para abordar imperfecciones y preocupaciones de la comunidad.

Pero piensa positivamente, podría simplificar las cosas. Así que esa podría ser una razón por la que quieras adoptarlo. Además, no están tratando de jugar contigo. Como si no estuvieran lanzando cosas al aire libre. Como si el equipo de React estuviera añadiendo RSCs y el framework solo para jugar contigo, ¿verdad? Tienes que pensar como, Oh, wow. Que todos están tratando de hacer lo correcto. Y luego. Así que quieres ver qué, ya sabes, qué, qué el framework y qué, qué esta nueva cosa está realmente tratando de lograr, como buscar la motivación subyacente y asegurarte de que se sincronice con lo que realmente quieres hacer. Eso es algo que quieres abrazar.

Y luego finalmente usa pruebas de concepto para averiguar si realmente va a funcionar en tu entorno. No intentes integrarlo en tu aplicación de inmediato. Eso puede causar muchos problemas y hacer que sea mucho más complejo. Es bueno trabajar con las cosas de manera aislada. Así que se trata de pensar positivamente en lugar de negativamente. Y todo esto, esta innovación y estas elecciones y la complejidad de ello. En realidad, cuando lo piensas al revés, no es malo. En realidad es bueno, nos demuestra que React es un framework intrépido, ¿verdad? Tenemos 11 años de una biblioteca y todavía están haciendo cosas increíbles. Añadieron componentes de servidor de React a una biblioteca de 11 años. Eso es increíble. También está en todas partes, ¿verdad? Piensa en todos los lugares donde puedes usar React web móvil. Es increíble. Y también es la primera opción. Cada vez que alguien va a construir un nuevo gestor de estado o framework, lo van a construir sobre React, pero nada es perfecto, ¿verdad? Así que necesitamos gobernanza. Eso es una de las cosas que vimos, ¿verdad? Así que Dominic estuvo aquí a principios de año. Tuvo un problema con React 19 y suspense. ¿Escucharon sobre eso? Sí. Bien, genial. Bueno, eso en realidad señaló que el equipo de React está tomando algunas decisiones sobre hacia dónde va el framework de React que podríamos no apreciar. Así que genial. En realidad son receptivos a eso.

10. React 19 and Governance

Short description:

React 19 se retrasa debido a problemas de suspense. La gobernanza en React es necesaria para evitar decisiones impulsadas por personalidades. Involúcrate con el equipo de React, participa en meetups locales y conferencias, y contribuye a proyectos de código abierto. React sigue prosperando, aunque ganarse la vida en YouTube puede ser un desafío.

Y es por eso que React 19 actualmente no ha salido porque todavía están trabajando en los problemas de suspense. Así que eso es genial, pero creo que también necesitamos un nivel de gobernanza y eso lo demostró. Además, React ha sido a veces impulsado por personalidades. Por ejemplo, tuvieron a Dan Abramov contra el mundo por los RSCs. Espera, esto es algo grande. Cuando los RSCs salieron por primera vez, Dan estaba en Twitter. Convencí a la gente de que los RSCs eran realmente geniales y estaban bien. Y la reacción que obtuvieron fue realmente, realmente terrible. Y eso en realidad, en realidad le costó al equipo de React algunos miembros y eso no es genial. Así que la buena noticia es que con algunos cambios en la estructura de ese equipo ahora es menos impulsado por personalidades. Vimos eso con React Con 2024 con todo el equipo allí dando presentaciones sobre las diversas partes de ello.

Entonces, ¿qué puedes hacer? ¿Cómo puedes interactuar con este equipo? ¿Cómo puedes hacer estas cosas? ¿Cómo puedes trabajar con React positivamente? Bueno, lo primero es mantenerlo positivo, ¿verdad? No critiques duramente a los miembros del equipo de React. Solo manténlo positivo. Lo realmente importante es involucrarse, volver a involucrarse con tu comunidad. De hecho, haz una encuesta en Twitter y pregunta a la gente, ¿ha regresado tu meetup local después de COVID? Así que pregunta para ti, ¿ha regresado tu meetup local? OK. En Portland, el mío no ha regresado. Así que consigue, ya sabes, tal vez 50 personas donde solía tener como 200. Así que realmente, realmente te animo a ir a esos meetups locales. Habla en conferencias locales. Un amigo mío hoy va a una conferencia local de IA aquí mismo en Londres con como 80 personas en ella. Y esos son el tipo de conferencias más grandes que alimentan a las conferencias más grandes y el tipo de lugar donde puedes tener la oportunidad de hablar tú mismo.

Lo siguiente es contribuir al código abierto, ¿verdad? Todo el genial ecosistema que tenemos alrededor de React es porque personas como tú tuvieron grandes ideas para bibliotecas geniales y las hicieron realidad. Muy bien, eso es lo que tengo. React está lejos de estar muerto. Soy Jaher en YouTube. Ven y suscríbete. Lo que quiero saber es que estás aquí y eres un YouTuber, pero eso es algo de lo que puedes vivir. Puedo cambiar a ser un YouTuber. ¿Puedes vivir de YouTube? Es realmente difícil. Sí, en realidad.

QnA

YouTube Revenue and Next.js Experimental Features

Short description:

Los ingresos por publicidad en YouTube son desafiantes, y ganarse la vida requiere ya sea videos virales o patrocinios. La reciente controversia en torno al patrocinio de Fireship con AppRite provocó discusiones. Las versiones estables de Next.js que utilizan características experimentales son una medida práctica para mantenerse al día. Sin embargo, se aconseja precaución ya que las características experimentales pueden no ser completamente estables. El equipo de Next.js puede tener información privilegiada sobre desarrollos en curso.

Sí, en realidad. Sí. Los ingresos por publicidad en YouTube son terribles. Así que la única manera de realmente ganarse la vida con ello es tener videos que alcancen millones de vistas, lo cual básicamente solo Fireship hace en nuestro espacio. O haces patrocinios. Y creo que eso es en realidad como un reciente alboroto sobre. Fireship fue el hecho de que hizo un patrocinio con AppRite y a la gente no le gustó mucho eso. Pero ya sabes, supongo que está bien.

La gente tiene que ganar dinero. Sí. Sí. Queremos contenido genial. Quieres contenido genial, alguien realmente tiene que pagar por eso. Sí, al menos estoy pensando que te gusta un techo sobre tu cabeza. Espero que tengas un techo sobre tu cabeza, sí. Algún día. Sí.

Genial. De acuerdo. Primera pregunta. Viene de Tiago. ¿Qué piensas sobre las versiones estables de Next.js usando características experimentales de React? Oh, eso es interesante. Quiero decir, creo que tiene que suceder en este momento debido al lanzamiento. Sabes, el 19 aún no se ha finalizado. Así que quiero decir, es básicamente una medida práctica. Quiero decir, si miras como el marco Waku, ellos también están haciendo cosas en la vanguardia. Solo significa que están tratando de mantenernos actualizados, lo cual creo que está bien. Pero, ya sabes, el AppRiter es, bueno, tienen seiscientos ahora y ahora 15. Así que eso se estabilizó. Pero sí, ya sabes, como con todo, si es experimental, entonces ten cuidado. Sí, supongo que el equipo de Next.

Componentes de Servidor de React y el Modelo de Hidratación de Qwik

Short description:

Los componentes de servidor de React son una innovación favorita. La UI generativa impulsada por IA habilitada por RSCs es fascinante y llevará a innovaciones fantásticas en el futuro. El modelo de hidratación de Qwik es genial y mejora el ciclo de hidratación del cliente, haciéndolo más rápido. El React Summit en Ámsterdam es un evento memorable.

Pero esto fue como el año pasado. Esa fue una gran discusión, ¿verdad? Y creo que el año pasado estábamos aquí y luego los componentes de servidor de React solo estaban disponibles en Next.js. Y ahora ese campo ha cambiado mucho, por supuesto. Pero, sí, solo tienen alguna información privilegiada. No hay nada que podamos hacer.

De acuerdo. John pregunta, ¿cuál es tu innovación favorita en los últimos años? En React, tienen que ser los componentes de servidor de React. Creo que son realmente, realmente fascinantes. De hecho, en realidad, veamos. Así que Tagus, sé que conoces a Tagus, ha estado haciendo un trabajo realmente genial con IA donde están haciendo UI generativa usando IA. Y eso es básicamente posible gracias a los RSCs. Y la IA puede esencialmente simplemente decirle a la UI al API que está respondiendo qué renderizar. Y luego puede ir y enviar de vuelta ese flujo de vuelo como acabamos de ver en el video y la última charla de vuelta al cliente y luego descargarlo. Ya sea usar los componentes del cliente o los componentes del servidor y obtener eso, ya sabes, el buen renderizado desde el servidor todavía. Así que creo que eso es realmente, realmente genial. Las innovaciones que vamos a ver alrededor de la UI generativa de la IA van a ser fantásticas en los próximos años. Sí, va a ser un par de años emocionantes, de hecho.

Siguiente pregunta. ¿Algo de otros frameworks que te gustaría dentro de React? Creo que el modelo de hidratación de Qwik es realmente genial. Me gustaría que más personas realmente probaran Qwik solo para verlo. Pero es realmente genuinamente, bueno, externamente a Google, muy innovador. Quiero decir, aparentemente Qwik es muy similar a Wix. Están en el framework de Toronto, pero creo que es muy, muy genial. Así que la idea es que puede. El ciclo de hidratación va a ser mucho más rápido en el cliente porque cada componente esencialmente tiene su propio pequeño bit de hidratación y solo hidrata lo que se requiere para realmente hidratarse para funcionar. Es muy, muy genial. Sí, recuerdo. Creo que fue el año pasado en el React Summit en Ámsterdam. ¿Alguien aquí ha estado en el React Summit en Ámsterdam? Unos pocos. Sí, has estado.

Qwik and React Compiler

Short description:

Qwik es increíble, y sería genial ver algo así para React. El código fuente de React es increíble, con un compilador de nueva generación que ofrece varias optimizaciones. La IA nunca tomará nuestros trabajos.

Puedes recordar. Sí, tuvimos que hablar de Misko. ¿Cuál es su nombre? Oh, sí, Misko. Sobre Qwik. Y me gusta, leí que existía, pero recuerdo que me dejó boquiabierto. Sí, es tan increíble. Si aún no has revisado Qwik, asegúrate de darle un vistazo. No creo que esté fuera del ámbito de posibilidad. Podrías ver algo así para React, para ser honesto. Y eso es una de las cosas con las que mucha gente lucha, es con ese tema de la hidratación. Así que sería realmente genial ver que eso realmente se concrete. Bueno, es de código abierto. Así que puedes simplemente añadirlo. ¿Has mirado el código fuente de React? No recientemente. Oh, Dios mío. Es increíble. Esto es como una pregunta filosófica. ¿Qué tan genial es el compilador de React? Creo que es realmente muy, muy genial porque no solo está haciendo esencialmente como un análisis AST muy básico y buscando señales particulares. En realidad está haciendo como una compilación completa del código y realmente ejecutándolo a través de como múltiples pasos y puedes optar por entrar y salir de varias optimizaciones. Es básicamente una generación completamente nueva de compilador que es como súper, es un poco, no quiero menospreciar a nadie más, pero como el compilador de Solid y ese tipo de cosas simplemente no tienen ese nivel de profundidad. Genial.

Bien. Siguiente pregunta. Sí. Bueno, lo retiro. La inevitable. ¿Cuándo tomará la IA nuestros trabajos? ¿Cuándo tomará nuestros trabajos? Nunca. No si, sino cuándo. Bien. Así que no, no creo que nunca vaya a tomar nuestros trabajos.

AI and No Code Tools

Short description:

La IA puede ayudarte a llegar al 80%, pero aún necesitas un desarrollador real para ajustar y limpiar el código. Las herramientas sin código como bolt.dev y bolt.new pueden acercarse, pero necesitarás agregar funcionalidad y pruebas. ¿Has probado cursor o co-pilot? Encuentro cursor realmente genial.

Quiero decir, ustedes han experimentado ese tipo de cosa del 80, 20 cuando se trata de IA, cuando se trata de nuestros trabajos, ¿verdad? Y él dice, te lleva como al 80%, pero aún necesitas tener un desarrollador real que entre y lo ajuste. Y es lo mismo con todas estas cosas.

Sin código con un bolt.dev. Si no has tenido la oportunidad de mirar eso, estaba pensando tal vez en bolt.new. Es de la gente de stack blitz. Básicamente dices, Oh, lo probé. Dije, dame wordle. Y se acercó bastante en realidad, pero realmente no lo entendió. Como que dio, ya sabes, opciones de palabras posibles que eran como de cuatro letras, seis letras. Sabes, como, está bien. Tienes la idea, pero no sabes realmente qué demonios estás haciendo. Así que definitivamente es la cosa del 80, 20. Vas a necesitar ir y limpiar el código. Vas a necesitar ir y agregar funcionalidad. No existe. Y vas a necesitar agregar pruebas. Como todo ese tipo de cosas, nuevamente, con las que la IA puede ayudarte.

Um, sin embargo, tengo curiosidad. Entonces, ¿alguien ha probado cursor? Sí. Está bien. Sí. Me gusta cursor. Cursors es realmente bueno. ¿Has estado en co-pilot o cursor? Co-pilot. Co-pilot. Sí. Sí. Sí. Estuve en co-pilot por un tiempo. Definitivamente encuentro que cursor.

Workflow and Longevity

Short description:

Tab AI mantiene tu flujo de trabajo sugiriendo adiciones mientras codificas. Es como magia. La gente todavía programa en Cobol después de muchos años, por lo que el concepto de 'morir' es relativo. React, siendo grande, es poco probable que muera completamente. Comencé a desarrollar a una edad temprana, enfocándome en Flash y ActionScript.

Simplemente, tiene esta, uh, interf de pestañas, uh, Tab AI y la idea de que observa lo que has estado haciendo recientemente y lo mantiene en marcha. Así que si estás agregando como un campo, dirá, Oh, está bien. Probablemente querrás agregar aquí, aquí, aquí, aquí, aquí, y luego presionas tab y simplemente sucede. Es realmente, es casi como magia. Es realmente, realmente genial.

Sí. Trabajo en el país empresarial. ¿Has visto, pero he visto demostraciones. Sí. Es realmente genial.

De acuerdo. Siguiente pregunta. Sí. Cuando, cuando este es tu, Dan está preguntando, ¿cuándo morirá? Yo diría, ya sabes, creo. ¿Serían 20 años? Quiero decir, eso es lo que pasa con la gente que todavía está programando en Cobol. Después de todo este tiempo y esas aplicaciones todavía están funcionando hoy. Sabes, ¿qué significa realmente morir? Quiero decir, algo tan grande como React, no creo que muera completamente.

De acuerdo. Así que acabas de mencionar que has estado desarrollando durante 40 años. Así que comenzaste cuando tenías como dos, creo, um, Así que cuando comencé a desarrollar, enfoqué mis esfuerzos en aprender Flash y ActionScript. Y pensé que era Adobe. Sí. Construimos un Flash Builder de Flex Builder. Tres Flex Builder. Genial. Sí. Con el ícono gris que era FX. Sí. Uh, uh, relájate.

React's Popularity and Future

Short description:

Siempre existe la posibilidad de algo mejor que Flash, pero considerando la cantidad de aplicaciones y su complejidad, la popularidad de React es innegable. El impulso detrás de React es fuerte, y es poco probable que desaparezca pronto. Sin embargo, predecir el futuro más allá de 20 años es incierto. Eso concluye nuestra discusión. ¡Gracias!

Pero de todos modos, sí. Pensé que esto es perfecto. Uh, estoy aprendiendo esto. Estoy listo de por vida. Sí. Estás bien. Y luego Steve Jobs escribió un poco, él está como pensamientos sobre flash. Y yo estaba como, sí, veo, estaba como, tengo esta cosa del iPhone. Nunca sabes si algo mejor podría aparecer.

Sí. No lo sabemos. Sí. Pero sabes, al final del día, hay tantas aplicaciones que están escritas en y la complejidad de esas aplicaciones es tan alta, sabes, vas a, hay va a haber mucha, hay mucha inercia allí que tienes que, y, y la inercia no se detiene. Quiero decir, ninguno de esos gráficos, todos están hacia arriba a la derecha cuando se trata de React.

Sí. Eso es cierto. Así que nunca es la respuesta. Sí, bueno, yo no lo haría. Tienes fácil 20 años y no puedes comprar una casa y poner un techo sobre tu cabeza en 20 años. No lo sé. Sí. De acuerdo. Eso es todo el tiempo que tenemos. De acuerdo. Preguntas y respuestas. Así que todos pueden, ¿puedo obtener un aplauso realmente, realmente suave para Jack? Un poco más fuerte, un poco más fuerte, un poco más fuerte, un poco más fuerte. Bien. De acuerdo.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Una Guía del Comportamiento de Renderizado de React
React Advanced 2022React Advanced 2022
25 min
Una Guía del Comportamiento de Renderizado de React
Top Content
This transcription provides a brief guide to React rendering behavior. It explains the process of rendering, comparing new and old elements, and the importance of pure rendering without side effects. It also covers topics such as batching and double rendering, optimizing rendering and using context and Redux in React. Overall, it offers valuable insights for developers looking to understand and optimize React rendering.
Construyendo Mejores Sitios Web con Remix
React Summit Remote Edition 2021React Summit Remote Edition 2021
33 min
Construyendo Mejores Sitios Web con Remix
Top Content
Remix is a web framework built on React Router that focuses on web fundamentals, accessibility, performance, and flexibility. It delivers real HTML and SEO benefits, and allows for automatic updating of meta tags and styles. It provides features like login functionality, session management, and error handling. Remix is a server-rendered framework that can enhance sites with JavaScript but doesn't require it for basic functionality. It aims to create quality HTML-driven documents and is flexible for use with different web technologies and stacks.
Compilador React Forget - Entendiendo React Idiomático
React Advanced 2023React Advanced 2023
33 min
Compilador React Forget - Entendiendo React Idiomático
Top Content
Joe Savona
Mofei Zhang
2 authors
The Talk discusses React Forget, a compiler built at Meta that aims to optimize client-side React development. It explores the use of memoization to improve performance and the vision of Forget to automatically determine dependencies at build time. Forget is named with an F-word pun and has the potential to optimize server builds and enable dead code elimination. The team plans to make Forget open-source and is focused on ensuring its quality before release.
Uso efectivo de useEffect
React Advanced 2022React Advanced 2022
30 min
Uso efectivo de useEffect
Top Content
Today's Talk explores the use of the useEffect hook in React development, covering topics such as fetching data, handling race conditions and cleanup, and optimizing performance. It also discusses the correct use of useEffect in React 18, the distinction between Activity Effects and Action Effects, and the potential misuse of useEffect. The Talk highlights the benefits of using useQuery or SWR for data fetching, the problems with using useEffect for initializing global singletons, and the use of state machines for handling effects. The speaker also recommends exploring the beta React docs and using tools like the stately.ai editor for visualizing state machines.
Enrutamiento en React 18 y más allá
React Summit 2022React Summit 2022
20 min
Enrutamiento en React 18 y más allá
Top Content
Routing in React 18 brings a native app-like user experience and allows applications to transition between different environments. React Router and Next.js have different approaches to routing, with React Router using component-based routing and Next.js using file system-based routing. React server components provide the primitives to address the disadvantages of multipage applications while maintaining the same user experience. Improving navigation and routing in React involves including loading UI, pre-rendering parts of the screen, and using server components for more performant experiences. Next.js and Remix are moving towards a converging solution by combining component-based routing with file system routing.
Concurrencia en React, Explicada
React Summit 2023React Summit 2023
23 min
Concurrencia en React, Explicada
Top Content
React 18's concurrent rendering, specifically the useTransition hook, optimizes app performance by allowing non-urgent updates to be processed without freezing the UI. However, there are drawbacks such as longer processing time for non-urgent updates and increased CPU usage. The useTransition hook works similarly to throttling or bouncing, making it useful for addressing performance issues caused by multiple small components. Libraries like React Query may require the use of alternative APIs to handle urgent and non-urgent updates effectively.

Workshops on related topic

Masterclass de Depuración de Rendimiento de React
React Summit 2023React Summit 2023
170 min
Masterclass de Depuración de Rendimiento de React
Top Content
Featured Workshop
Ivan Akulov
Ivan Akulov
Los primeros intentos de Ivan en la depuración de rendimiento fueron caóticos. Vería una interacción lenta, intentaría una optimización aleatoria, vería que no ayudaba, y seguiría intentando otras optimizaciones hasta que encontraba la correcta (o se rendía).
En aquel entonces, Ivan no sabía cómo usar bien las herramientas de rendimiento. Haría una grabación en Chrome DevTools o React Profiler, la examinaría, intentaría hacer clic en cosas aleatorias, y luego la cerraría frustrado unos minutos después. Ahora, Ivan sabe exactamente dónde y qué buscar. Y en esta masterclass, Ivan te enseñará eso también.
Así es como va a funcionar. Tomaremos una aplicación lenta → la depuraremos (usando herramientas como Chrome DevTools, React Profiler, y why-did-you-render) → identificaremos el cuello de botella → y luego repetiremos, varias veces más. No hablaremos de las soluciones (en el 90% de los casos, es simplemente el viejo y regular useMemo() o memo()). Pero hablaremos de todo lo que viene antes - y aprenderemos a analizar cualquier problema de rendimiento de React, paso a paso.
(Nota: Esta masterclass es más adecuada para ingenieros que ya están familiarizados con cómo funcionan useMemo() y memo() - pero quieren mejorar en el uso de las herramientas de rendimiento alrededor de React. Además, estaremos cubriendo el rendimiento de la interacción, no la velocidad de carga, por lo que no escucharás una palabra sobre Lighthouse 🤐)
Next.js para Desarrolladores de React.js
React Day Berlin 2023React Day Berlin 2023
157 min
Next.js para Desarrolladores de React.js
Top Content
Featured WorkshopFree
Adrian Hajdin
Adrian Hajdin
En esta avanzada masterclass de Next.js, profundizaremos en conceptos clave y técnicas que permiten a los desarrolladores de React.js aprovechar al máximo Next.js. Exploraremos temas avanzados y prácticas prácticas, equipándote con las habilidades necesarias para construir aplicaciones web de alto rendimiento y tomar decisiones arquitectónicas informadas.
Al final de esta masterclass, serás capaz de:1. Comprender los beneficios de los Componentes del Servidor React y su papel en la construcción de aplicaciones React interactivas, renderizadas por el servidor.2. Diferenciar entre el tiempo de ejecución de Edge y Node.js en Next.js y saber cuándo usar cada uno en función de los requisitos de tu proyecto.3. Explorar técnicas avanzadas de Renderizado del Lado del Servidor (SSR), incluyendo streaming, fetching paralelo vs. secuencial, y sincronización de datos.4. Implementar estrategias de caché para mejorar el rendimiento y reducir la carga del servidor en las aplicaciones Next.js.5. Utilizar Acciones React para manejar la mutación compleja del servidor.6. Optimizar tus aplicaciones Next.js para SEO, compartir en redes sociales, y rendimiento general para mejorar la descubrabilidad y la participación del usuario.
Aventuras de Renderizado Concurrente en React 18
React Advanced 2021React Advanced 2021
132 min
Aventuras de Renderizado Concurrente en React 18
Top Content
Featured Workshop
Maurice de Beijer
Maurice de Beijer
Con el lanzamiento de React 18 finalmente obtenemos el tan esperado renderizado concurrente. Pero, ¿cómo va a afectar eso a tu aplicación? ¿Cuáles son los beneficios del renderizado concurrente en React? ¿Qué necesitas hacer para cambiar al renderizado concurrente cuando actualices a React 18? ¿Y qué pasa si no quieres o no puedes usar el renderizado concurrente todavía?

¡Hay algunos cambios de comportamiento de los que debes estar al tanto! En esta masterclass cubriremos todos esos temas y más.

Acompáñame con tu portátil en esta masterclass interactiva. Verás lo fácil que es cambiar al renderizado concurrente en tu aplicación React. Aprenderás todo sobre el renderizado concurrente, SuspenseList, la API startTransition y más.
Consejos sobre React Hooks que solo los profesionales conocen
React Summit Remote Edition 2021React Summit Remote Edition 2021
177 min
Consejos sobre React Hooks que solo los profesionales conocen
Top Content
Featured Workshop
Maurice de Beijer
Maurice de Beijer
La adición de la API de hooks a React fue un cambio bastante importante. Antes de los hooks, la mayoría de los componentos tenían que ser basados en clases. Ahora, con los hooks, estos son a menudo componentes funcionales mucho más simples. Los hooks pueden ser realmente simples de usar. Casi engañosamente simples. Porque todavía hay muchas formas en las que puedes equivocarte con los hooks. Y a menudo resulta que hay muchas formas en las que puedes mejorar tus componentes con una mejor comprensión de cómo se puede usar cada hook de React.Aprenderás todo sobre los pros y los contras de los diversos hooks. Aprenderás cuándo usar useState() versus useReducer(). Veremos cómo usar useContext() de manera eficiente. Verás cuándo usar useLayoutEffect() y cuándo useEffect() es mejor.
Presentando FlashList: Construyamos juntos una lista performante en React Native
React Advanced 2022React Advanced 2022
81 min
Presentando FlashList: Construyamos juntos una lista performante en React Native
Top Content
Featured Workshop
David Cortés Fulla
Marek Fořt
Talha Naqvi
3 authors
En esta masterclass aprenderás por qué creamos FlashList en Shopify y cómo puedes usarlo en tu código hoy. Te mostraremos cómo tomar una lista que no es performante en FlatList y hacerla performante usando FlashList con mínimo esfuerzo. Usaremos herramientas como Flipper, nuestro propio código de benchmarking, y te enseñaremos cómo la API de FlashList puede cubrir casos de uso más complejos y aún así mantener un rendimiento de primera categoría.Sabrás:- Breve presentación sobre qué es FlashList, por qué lo construimos, etc.- Migrando de FlatList a FlashList- Enseñando cómo escribir una lista performante- Utilizando las herramientas proporcionadas por la biblioteca FlashList (principalmente el hook useBenchmark)- Usando los plugins de Flipper (gráfico de llamas, nuestro perfilador de listas, perfilador de UI & JS FPS, etc.)- Optimizando el rendimiento de FlashList utilizando props más avanzados como `getType`- 5-6 tareas de muestra donde descubriremos y solucionaremos problemas juntos- Preguntas y respuestas con el equipo de Shopify
React, TypeScript y TDD
React Advanced 2021React Advanced 2021
174 min
React, TypeScript y TDD
Top Content
Featured Workshop
Paul Everitt
Paul Everitt
ReactJS es extremadamente popular y, por lo tanto, ampliamente soportado. TypeScript está ganando popularidad y, por lo tanto, cada vez más soportado.

¿Los dos juntos? No tanto. Dado que ambos cambian rápidamente, es difícil encontrar materiales de aprendizaje precisos.

¿React+TypeScript, con los IDEs de JetBrains? Esa combinación de tres partes es el tema de esta serie. Mostraremos un poco sobre mucho. Es decir, los pasos clave para ser productivo, en el IDE, para proyectos de React utilizando TypeScript. En el camino, mostraremos el desarrollo guiado por pruebas y enfatizaremos consejos y trucos en el IDE.