Que yo no me entero de una mierda.
O sea, yo intento entender un poco de arriba a abajo y no me entero.
Digo, ¿pero esto qué es?
Parece astro, pero...
Dice, parece astro, pero en porros.
Esto no me lo creo.
Son las 4 y 14 minutos.
Hora pensión española.
Bueno, 4 y 14.
Toca nuevo framework de JavaScript.
Bienvenidos a un nuevo framework de JavaScript.
Frontend Troublesolver.
No Troublemaker.
NUE o Niu.
Niu.
No sé cómo se pronuncie.
Es una alternativa a React, Vue, Next.js, VIT y astro.
Siempre tiene que ser alternativa de algo.
Ya sabéis que siempre a la gente le gusta que sean alternativas de todo.
Y aquí nos dice, mira, para hacer en React.
Aquí te dice ListBox Component.
Dice que para hacer un ListBox con React serían todas estas líneas de código.
Todas estas líneas de código.
En cambio, con NUE, que es el nuevo framework, sería solo con estas líneas de código.
O sea, de 2.537 a 208 líneas de código.
Eso dice, con Vue pasa de 2.000 líneas a 200 y con Svel de 1.200 a 200.
Mira, vamos a ver el de React, por ejemplo.
Este sería el de React y este sería el de NUE.
Súper fácil y tal.
Yo lo hago en una línea.
Si pongo toda lógica en otro archivo.
Claro, claro.
Parece una mezcla entre algo de Svel, HTMLX, ¿vale?
Que también hay otro framework.
¿Qué pasa con estas cosas?
No soy muy fan de estas cosas, ¿vale?
El arroba name, ListBox.
No soy...
A mí no me suelen gustar mucho.
Porque como acá, a mí personalmente, al final como que hay una abstracción tan bestia
que yo no me entero de una mierda.
O sea, yo intento entender un poco de arriba abajo y no me entero.
Digo, ¿pero esto qué es?
Por ejemplo, este ListBox, ¿dónde va?
O sea, hay que aprenderlo.
Y hay como unas cuantas magias que a mí me cuestan un poco.
Que luego, me imagino que cuando eres un megacrack, pues lo entiendes.
Pero, ¿ves?
A mí estas cosas de dos puntos, class.
Tienes que abrir string.
Y entonces abres aquí divider, dos puntos, diferente label, no sé cuántos.
No me suelen gustar, lo siento, las directivas.
Pero es que estos van a otro nivel.
Porque además lo ponen como en cadenas de texto.
Y es como demasiado abstracto todo.
Y digo, yo no me entero de nada.
¿Que sí que lo haces en una línea?
Vale, lo haces en una línea.
Pero yo no me estoy enterando.
Yo no me estoy enterando.
¿Vale?
Que tiene buena pinta, ¿eh?
Pero bueno, así de a priori no soy muy fan.
Pero hombre, es verdad.
Esto sería todo el código.
Son tres archivos.
Y en cambio React, fíjate.
Dicen ellos que tendrías que hacer todo este código que estáis viendo aquí a la izquierda.
Para hacer exactamente lo mismo.
No sé, no sé.
Puede ser, ¿eh?
Puede ser.
Pero vaya, la comparativa.
En este caso dices, vale, es verdad.
Que a lo mejor cuesta más de entender.
Pero también es verdad que ría, joder.
Mira, aquí un homepage con Tailwind, 4.000 líneas.
Con New, 31 líneas.
A ver, explícame esto.
¿Cómo puede ser esto?
¿Cómo puede ser esto?
¿Dónde están los estilos en estas 30 líneas?
¿Dónde están aquí?
O sea, aquí hay cosas que es obvio que faltan.
Yo esto no me lo creo.
Yo a mí estas comparaciones parece más ciencia ficción.
Te has fumado algo.
Esta es la home.
Vale, sí, la home.
Tú te pones a mirar un poco la home y dices, vale.
Aquí relative, px4, no sé qué, no sé cuánto.
Aquí hay clases.
La home de New.
Vale, dice frontend, no sé qué.
Claro, me estás comparando dos cosas totalmente.
O sea, me estás comparando la home de Tailwind, de la página de Tailwind, con la home de New.
Si tú lo has hecho así de fácil o así de sencillo, será porque tú has querido.
Pero amigos, aquí no hay ni una línea de CSS.
Hay una clase aquí, ya está.
O sea, no me creo que todo esto que veis, al final, venga estilado por arte de magia.
Por el todopoderoso, viene aquí.
El problema que tengo muchas veces con los frameworks, para mí un problema que hay es,
cuanto más se compara con el resto, menos interés le tengo.
Porque entonces parece más un framework hecho y pensado para destruir el resto, ¿no?
Que no para realmente solucionar problemas.
Fijaos que es que es constante, ¿eh?
Niveles de velocidad.
Mira, y lo compara con Astro.
Dice, 13k.
13k y Astro son 84, pero ya que es menos 13k, ¿qué va a ser lo siguiente?
Mira, es este, Tero Piranen.
Vamos a ver un poco en Hacker News, que es lo que comentan.
Por aquí estoy sacando dos cosas.
New.js, que es una biblioteca de JavaScript que solo ocupa 2k para construir interfaces de usuario.
Es como React y Vue, pero no tiene hooks, no tiene efectos, no tiene props, no tiene otras atracciones.
Si sabes HTML, CSS y JavaScript, ya está, ya sabes.
New soporta server-side rendering, componentes reactivos, combinaciones isomórficas.
Se inspira en Vue2 y Riot.js.
De hecho, soy el autor original de Riot.
La cosa es que no estoy contento con el estado actual del desarrollo web.
Así que quiero escribir totalmente...
Esto es tan típico, esto es tan típico, que es que de verdad me da hasta pena.
A mí, esta frase, tío, esta...
La cosa es que no estoy contento con el estado actual del desarrollo web,
así que quiero escribir completamente desde cero un nuevo ecosistema.
Así siempre, ¿sabes?
No estoy contento, hay que refactorizarlo todo, ¿no?
Eso resume todos los frameworks.
Hostia, sí y no.
Porque si te fijas, por ejemplo, Astro de alguna forma no viene a reinventarlo todo.
Viene a suplir un hueco que había y reutilizar los frameworks que existen.
O sea, puedes utilizar React, puedes utilizar un montón de cosas.
Se basa en JSX, ¿no?
O sea, no dice tanto eso, sino que dice, oye, vamos a crear un framework que te da una ventaja,
pero puedes seguir utilizando todo lo que sabes.
O sea, ves la diferencia.
Pero el decir, es que no me gusta, no me gusta, voy a crear un ecosistema desde cero.
¡Qué pereza!
¡Qué pereza!
¡Qué pereza, tío!
Porque encima dice, estoy tomando ventaja de viejas innovaciones como el progressive,
mejora progresiva, separación de conceptos y un diseño de la web semántica.
Los beneficios están aquí, aquí están los beneficios.
Multi-page applications, SPAs también puedes hacer, que funciona para UX engineers,
para JavaScript developers, para creadores de contenido, que así evitas el código spaghetti,
que tienes hot reloading de cualquier archivo, no importa cómo de grande sea el cambio.
De hecho, pero bueno, a mí esto tampoco me sorprende.
O sea, esto es una cosa, ves, que aquí cambia solver.
Tener hot reloading de markdown, yo eso ya lo había visto, pero bueno.
Que es muy pequeño, menos es más, fácil de mantener, fácil de usar, menos bugs y más rápido.
Frontend obesity crisis, bueno, en eso vamos a estar de acuerdo, que sí que ha habido un problema de obesidad.
De hecho, vamos a ver, podemos, vamos a ejecutarlo, vamos a ejecutarlo.
Ah, mira, la forma recomendada es clonar el repositorio, empieza mal.
No me gusta porque, hombre, clonar el repositorio, joder, lo que quiero es crearme un proyecto yo con el npx create, lo que sea, ¿no?
Create new, venga, create new, a ver qué me cuenta el create new este, ¿vale?
Aquí podemos ver que este sería el packet JSON, con los scripts para ejecutar, cd punto punto no sé qué, new year score, ¿vale?
Vamos a hacer el npm install, a ver si es tan rápido npm install.
Hombre, debería ser inmediato, porque no tiene casi, muy bien, tres segundos.
Me gusta, por ahora me ha gustado.
npm run start, me entiendo que será, ¿vale?
Compilando, 80-80, ¿vale?
Tenemos los componentes, el contenido, islas.
Entiendo que, claro, yo me imagino que esto no tendrá extensión, porque ¿veis que sale todo gris?
Claro.
Ahora, por ahora, me imagino que hará una extensión en su día, por ahora a lo mejor será utilizada HTML, que es lo más parecido.
Pero claro, ¿veis?
Ya hay problemas, o sea, está muy verde, ¿eh?
Está muy, muy, muy verde.
Pero ¿ves?
A cada uno le tienes que poner el nombre.
Que esto sería que lo utiliza como si fuesen web components, ¿vale?
Contenido, el contenido será como el markdown.
Y claro, a cada parte del contenido, ¿ves?
Aquí tienes el título, el heading, ¿vale?
Estos son como los componentes.
Pero bueno, componentes que además tienes que poner aquí un comentario para que quede claro.
Pone library of servers and components usados en layout.nu.
A veces, el problema de las abstracciones es como que tienes que tirar mucho del hilo para entenderlo, ¿no?
Parece astro, pero...
Dice, parece astro, pero en porros.
Totalmente, a ver.
No, tiene buena pinta, tiene buena pinta, pero me parece como que es demasiado pronto todavía para pensar que esto va a ser algo serio.
Tiene buena pinta, pero que puede ser un poco mágico, demasiado mágico, ¿no?
Que a lo mejor para hacer una landing y tal puede estar bien.
Yo creo que lo que podría estar genial, más que comentarios, pues a lo mejor que haya hecho un tutorial desde cero, que haya un vídeo de cómo hacerlo, no sé.
Porque tiene la documentación que está bastante bien, ¿eh?
Por lo que he estado viendo la documentación.
Y la verdad es que el diseño me gusta bastante.
Te habla de los componentes.
Se tienen que definir aquí, poniéndole el nombre al primer elemento, o sea, div, section o lo que sea, ¿no?
Pero claro, luego, un tema que a mí me preocupa es que el hecho de el modo de renderizado está en un componente, como en un archivo aparte.
Que eso es un poco raro, ¿vale?
¿Ves? Hacer el nesting sería como web components.
Parece más un concepto.
Sí, parece más un concepto a día de hoy, ¿no?
Pero mira, aquí tendríamos, por ejemplo, este componente de galería de imágenes, que sería esto, ¿no?
Este sería el nombre del componente, que se lo pones aquí con arroba name.
Y luego, pues tendríamos aquí la magia, este index menos menos.
Que claro, ¿de dónde ha salido este index?
O sea, me lo está creando.
Ah, lo tienes aquí.
Lo tienes aquí, pero tienes el script dentro del HTML.
Que esto va a costar, ¿sabes?
Va a costar.
Va a costar que la gente se meta aquí de una.
Luego aquí, para hacer el loop, dos puntos for.
Entonces, algunas directivas son con dos puntos.
Otras son con arroba.
Cuando es click.
Y este sería el template, las expresiones, expresiones de HTML.
Bueno, uno más, uno más.
Ya, yo creo que el problema es el hecho de pensar que todo vale por escribir menos.
A ver, a mí me encanta escribir menos.
Yo soy el primero, que soy un perraco, que me gusta escribir poco.
Pero, también os digo, no tiene que ser a costa de todo.
Por ejemplo, yo también digo que hay veces que es mejor escribir un poco más y hacer algo más legible.
Que la intención quede clara.
Que no el hecho de decir, no, voy a hacer que escribas menos, pero no vas a entender muy bien qué hace cada cosa.
Yo creo que con Svelte ya llegamos a un punto del palo.
Oye, ya, ya, hasta aquí.
Total, la inteligencia artificial va a escribir la mitad.
¿Sabes del código?
Ya no me da tanto palo escribir.
Prefiero que se entienda.
¡Suscríbete al canal!